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 相关文章推荐
Prototype最新版(1.5 rc2)使用指南(1)
Jan 10 Javascript
JavaScript 事件查询综合
Jul 13 Javascript
jquery.validate使用攻略 第五步 正则验证
Jul 01 Javascript
js确定对象类型方法
Mar 30 Javascript
js实现杯子倒水问题自动求解程序
Mar 25 Javascript
jquery插件开发之实现md5插件
Mar 17 Javascript
用vuex写了一个购物车H5页面的示例代码
Dec 04 Javascript
200行HTML+JavaScript实现年会抽奖程序
Jan 22 Javascript
简单两步使用node发送qq邮件的方法
Mar 01 Javascript
微信小程序返回上一页传参并刷新过程解析
Dec 13 Javascript
three.js 如何制作魔方
Jul 31 Javascript
vue+echarts实现动态折线图的方法与注意
Sep 01 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
Yii2使用表单上传文件的实例代码
2017/08/03 PHP
浅谈PHP中如何实现Hook机制
2017/11/14 PHP
PHP函数按引用传递参数及函数可选参数用法示例
2018/06/04 PHP
js常见表单应用技巧
2008/01/09 Javascript
不用写JS也能使用EXTJS视频演示
2008/12/29 Javascript
Ext 表单布局实例代码
2009/04/30 Javascript
js 函数的执行环境和作用域链的深入解析
2009/11/01 Javascript
flash 得到自身url参数的代码
2009/11/15 Javascript
javascript 异步页面查询实现代码(asp.net)
2010/05/26 Javascript
js屏蔽鼠标键盘(右键/Ctrl+N/Shift+F10/F11/F5刷新/退格键)
2013/01/24 Javascript
jQuery调用AJAX时Get和post公用的乱码解决方法实例说明
2013/06/04 Javascript
Javascript alert消息换行的方法
2013/08/07 Javascript
JS预览图像将本地图片显示到浏览器上
2013/08/25 Javascript
JQuery处理json与ajax返回JSON实例代码
2014/01/03 Javascript
node.js中的fs.chownSync方法使用说明
2014/12/16 Javascript
JavaScript获取页面中超链接数量的方法
2015/11/09 Javascript
深入理解Javascript中的自执行匿名函数
2016/06/03 Javascript
JS设计模式之数据访问对象模式的实例讲解
2017/09/30 Javascript
浅谈webpack4.x 入门(一篇足矣)
2018/09/05 Javascript
微信小程序实现swiper切换卡内嵌滚动条不显示的方法示例
2018/12/20 Javascript
vue集成kindeditor富文本的实现示例代码
2019/06/07 Javascript
javascript实现日历效果
2019/06/17 Javascript
js获取对象,数组所有属性键值(key)和对应值(value)的方法示例
2019/06/19 Javascript
ES6字符串的扩展实例
2020/12/21 Javascript
浅谈Python中range和xrange的区别
2017/12/20 Python
Python编程pygame模块实现移动的小车示例代码
2018/01/03 Python
Python 实现使用dict 创建二维数据、DataFrame
2018/04/13 Python
python实现对输入的密文加密
2019/03/20 Python
python实现UDP协议下的文件传输
2020/03/20 Python
印度民族服装购物网站:BIBA
2019/08/05 全球购物
创业者是否需要商业计划书?
2014/02/07 职场文书
电子银行营销方案
2014/02/22 职场文书
经营管理策划方案
2014/05/22 职场文书
奉献家乡演讲稿
2014/09/13 职场文书
授权委托书样本及填写说明
2014/09/19 职场文书
【TED出品】天梯非主流开心游1700 划水骑士
2022/03/31 魔兽争霸