Angular中$state.go页面跳转并传递参数的方法


Posted in Javascript onMay 09, 2017

遇到一个页面跳转的时候,在跳转后的页面获取跳转前页面的数据,我想到用一种是localstorage,一种用broadcast和on,然后老大说不用这么麻烦,既然都$state.go了直接带参数,这次就介绍一下$state.go页面跳转传递参数。

1.路由页面(注意这里要在路由上添加一个参数用于传递数据,不然在页面跳转的时候会filter)

.state("home.workpiece",{ // 跳转前的页面
   url:"/workpiece",
   views: {
    home: {
     templateUrl: prefix + "project/workpiece.html",
     controller: "workpieceCtrl"
    }
   }
  })
  .state("home.workpieceDetail",{  //跳转后的页面
   url:"/workpieceDetail?workpieceList",
   views: {
    home: {
     templateUrl: prefix + "project/workpiece_detail.html",
     controller: "workpieceDetailCtrl"
    }
   }
  })

    也可以将参数放在params中  

.state("home.workpieceDetail",{
   url:"/workpieceDetail",
   views: {
    home: {
     templateUrl: prefix + "project/workpiece_detail.html",
     controller: "workpieceDetailCtrl"
    }
   },
   params: {workpieceList:null}
  })

2.在workpieceCtrl中 

3.workpieceDetailCtrl中

这样就可以将在页面跳转的时候传递数据了。希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
jquery实现心算练习代码
Dec 06 Javascript
jQuery中parent()方法用法实例
Jan 07 Javascript
JavaScript实现基于十进制的四舍五入实例
Jul 17 Javascript
jQuery焦点图切换特效代码分享
Sep 15 Javascript
详解js中构造流程图的核心技术JsPlumb(2)
Dec 08 Javascript
JavaScript必知必会(七)js对象继承
Jun 08 Javascript
概述VUE2.0不可忽视的很多变化
Sep 25 Javascript
jquery对象和DOM对象的相互转换详解
Oct 18 Javascript
浅谈React组件之性能优化
Mar 02 Javascript
jQuery 操作 HTML 元素和属性的方法
Nov 12 jQuery
动态内存分配导致影响Javascript性能的问题
Dec 18 Javascript
关于vue.js中实现方法内某些代码延时执行
Nov 14 Javascript
Vue 2.0中生命周期与钩子函数的一些理解
May 09 #Javascript
JavaScript中splice与slice的区别
May 09 #Javascript
详解node中创建服务进程
May 09 #Javascript
微信小程序 自动登陆PHP源码实例(源码下载)
May 08 #Javascript
jquery.uploadifive插件怎么解决上传限制图片或文件大小问题
May 08 #jQuery
微信小程序 标签传入数据
May 08 #Javascript
Webpack实现按需打包Lodash的几种方法详解
May 08 #Javascript
You might like
PHP制作3D扇形统计图以及对图片进行缩放操作实例
2014/10/23 PHP
php创建和删除目录函数介绍和递归删除目录函数分享
2014/11/18 PHP
PHP实现的链式队列结构示例
2017/09/15 PHP
实例分析10个PHP常见安全问题
2019/07/09 PHP
Laravel修改验证提示信息为中文的示例
2019/10/23 PHP
TP5框架model常见操作示例小结【增删改查、聚合、时间戳、软删除等】
2020/04/05 PHP
jquery新的绑定事件机制on方法的使用方法
2014/04/15 Javascript
每天一篇javascript学习小结(Boolean对象)
2015/11/12 Javascript
实例讲解js验证表单项是否为空的方法
2016/01/09 Javascript
jQuery实现的简单在线计算器功能
2017/05/11 jQuery
jQuery自定义多选下拉框效果
2017/06/19 jQuery
基于对象合并功能的实现示例
2017/10/10 Javascript
移动端效果之IndexList详解
2017/10/20 Javascript
js中的闭包学习心得
2018/02/06 Javascript
JS点击动态添加标签、删除指定标签的代码
2018/04/18 Javascript
vue插件开发之使用pdf.js实现手机端在线预览pdf文档的方法
2018/07/12 Javascript
详解使用VueJS开发项目中的兼容问题
2018/08/02 Javascript
在nuxt中使用路由重定向的实例
2020/11/06 Javascript
Python的批量远程管理和部署工具Fabric用法实例
2015/01/23 Python
pymongo给mongodb创建索引的简单实现方法
2015/05/06 Python
Python爬取APP下载链接的实现方法
2016/09/30 Python
python利用dir函数查看类中所有成员函数示例代码
2017/09/08 Python
详解Python 调用C# dll库最简方法
2019/06/20 Python
pyqt5让图片自适应QLabel大小上以及移除已显示的图片方法
2019/06/21 Python
windows安装TensorFlow和Keras遇到的问题及其解决方法
2019/07/10 Python
python实现爱奇艺登陆密码RSA加密的方法示例详解
2020/05/27 Python
教你使用Canvas处理图片的方法
2017/11/28 HTML / CSS
Linux管理员面试经常问道的相关命令
2013/04/29 面试题
我们在web应用开发过程中经常遇到输出某种编码的字符,如iso8859-1等,如何输出一个某种编码的字符串?
2014/03/30 面试题
办公室前台岗位职责
2014/01/04 职场文书
少先队学雷锋活动总结范文
2014/03/09 职场文书
指导教师评语
2014/04/26 职场文书
庆元旦活动总结
2014/07/09 职场文书
公司捐书倡议书
2015/04/27 职场文书
教师听课学习心得体会
2016/01/15 职场文书
OpenCV-Python实现轮廓的特征值
2021/06/09 Python