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 相关文章推荐
Javascript中的delete操作符详细介绍
Jun 06 Javascript
深入理解ECMAScript的几个关键语句
Jun 01 Javascript
Angular在一个页面中使用两个ng-app的方法(二)
Feb 20 Javascript
微信小程序-滚动消息通知的实例代码
Aug 03 Javascript
史上最全JavaScript常用的简写技巧(推荐)
Aug 17 Javascript
基于JavaScript实现五子棋游戏
Aug 26 Javascript
使用vue-router设置每个页面的title方法
Feb 11 Javascript
详解webpack运行Babel教程
Jun 13 Javascript
小程序视频列表中视频的播放与停止的示例代码
Jul 20 Javascript
vue实现倒计时获取验证码效果
Apr 17 Javascript
微信小程序一周时间表功能实现
Oct 17 Javascript
JavaScript监听触摸事件代码实例
Dec 30 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 array 的加法操作代码
2010/07/24 PHP
浅谈ThinkPHP5.0版本和ThinkPHP3.2版本的区别
2017/06/17 PHP
PHP实现绘制二叉树图形显示功能详解【包括二叉搜索树、平衡树及红黑树】
2017/11/16 PHP
PHP pthreads v3下同步处理synchronized用法示例
2020/02/21 PHP
多个iframe自动调整大小的问题
2006/09/18 Javascript
基于JQuery的类似新浪微博展示信息效果的代码
2012/07/23 Javascript
jQuery之选择组件的深入解析
2013/06/19 Javascript
js出生日期 年月日级联菜单示例代码
2014/01/10 Javascript
js实现星星打分效果的方法
2020/07/05 Javascript
招聘网站基于jQuery实现自动刷新简历
2015/05/10 Javascript
基于jQuery实现搜索关键字自动匹配功能
2020/03/26 Javascript
JQuery实现网页右侧随动广告特效
2016/01/17 Javascript
jquery日历插件e-calendar升级版
2016/11/10 Javascript
javascript中apply/call和bind的使用
2017/02/15 Javascript
vue中使用element-ui进行表单验证的实例代码
2018/06/22 Javascript
VUE-cli3使用 svg-sprite-loader
2018/10/20 Javascript
node解析修改nginx配置文件操作实例分析
2019/11/06 Javascript
JS+HTML5本地存储Localstorage实现注册登录及验证功能示例
2020/02/10 Javascript
[00:03]DOTA2新版本PA至宝展示
2014/11/19 DOTA
[01:06:12]VP vs NIP 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/17 DOTA
python函数局部变量用法实例分析
2015/08/04 Python
Python的Flask框架中SQLAlchemy使用时的乱码问题解决
2015/11/07 Python
深入理解Django的中间件middleware
2018/03/14 Python
python+pandas生成指定日期和重采样的方法
2018/04/11 Python
PyCharm代码格式调整方法
2018/05/23 Python
Python 用三行代码提取PDF表格数据
2019/10/13 Python
基于python中__add__函数的用法
2019/11/25 Python
python如何调用java类
2020/07/05 Python
世界顶级户外运动品牌折扣网站:LeftLane Sports
2019/06/12 全球购物
物流创业计划书
2014/02/01 职场文书
小学教学随笔感言
2014/02/26 职场文书
滴水洞导游词
2015/02/10 职场文书
酒店财务部岗位职责
2015/04/14 职场文书
Go各时间字符串使用解析
2021/04/02 Golang
Python中os模块的简单使用及重命名操作
2021/04/17 Python
python中的sys模块和os模块
2022/03/20 Python