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 解析读取XML文档 实例代码
Jul 07 Javascript
前端开发的开始---基于面向对象的Ajax类
Sep 17 Javascript
js focus不起作用的解决方法(主要是因为dom元素是否加载完成)
Nov 05 Javascript
jQuery中:eq()选择器用法实例
Dec 29 Javascript
js实现禁止中文输入的方法
Jan 14 Javascript
js实现拖拽效果
Feb 12 Javascript
jfinal与bootstrap的登录跳转实战演习
Sep 22 Javascript
深入解析桶排序算法及Node.js上JavaScript的代码实现
Jul 06 Javascript
Angular2关于@angular/cli默认端口号配置的问题
Jul 15 Javascript
解决Vue axios post请求,后台获取不到数据的问题方法
Aug 11 Javascript
JavaScript实现动态留言板
Mar 16 Javascript
Vue实现移动端拖拽交换位置
Jul 29 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递归调用的小技巧讲解
2013/02/19 PHP
请离开include_once和require_once
2013/07/18 PHP
从零开始学YII2框架(六)高级应用程序模板
2014/08/20 PHP
PHP快速排序quicksort实例详解
2016/09/28 PHP
php fseek函数读取大文件两种方法
2016/10/12 PHP
PHP实现简易图形计算器
2020/08/28 PHP
js点击页面其它地方将某个显示的DIV隐藏
2012/07/12 Javascript
jquery实现弹出窗口效果的实例代码
2013/11/28 Javascript
JS计算网页停留时间代码
2014/04/28 Javascript
jQuery实现向下滑出的二级菜单效果实例
2015/08/22 Javascript
jQuery操作基本控件方法实例分析
2015/12/31 Javascript
Jquery 整理元素选取、常用方法一览表
2016/11/26 Javascript
JS闭包用法实例分析
2017/03/27 Javascript
Javascript中click与blur事件的顺序详析
2017/04/25 Javascript
详解有关easyUI的拖动操作中droppable,draggable用法例子
2017/06/03 Javascript
javascript中this的用法实践分析
2019/07/29 Javascript
vue中h5端打开app(判断是安卓还是苹果)
2021/02/26 Vue.js
[42:48]完美世界DOTA2联赛PWL S3 Magma vs INK ICE 第二场 12.11
2020/12/16 DOTA
python目录操作之python遍历文件夹后将结果存储为xml
2014/01/27 Python
python实现监控windows服务并自动启动服务示例
2014/04/17 Python
Python实现简单网页图片抓取完整代码实例
2017/12/15 Python
Python操作MySQL数据库的方法
2018/06/20 Python
python利用ffmpeg进行录制屏幕的方法
2019/01/10 Python
详解Python在使用JSON时需要注意的编码问题
2019/12/06 Python
利用css3-animation实现逐帧动画效果
2016/03/10 HTML / CSS
什么是三层交换,说说和路由的区别在那里
2014/09/01 面试题
string = null 和string = ''的区别
2013/04/28 面试题
学生档案自我鉴定
2013/10/07 职场文书
气象学专业个人求职信
2014/03/15 职场文书
党员民主生活会个人整改措施材料
2014/09/16 职场文书
2014年干部培训工作总结
2014/12/17 职场文书
大学生求职意向书
2015/05/11 职场文书
党支部对转正的意见
2015/06/02 职场文书
新闻通讯稿范文
2015/07/22 职场文书
中国式结婚:司仪主持词(范文)
2019/07/25 职场文书
Python趣味爬虫之用Python实现智慧校园一键评教
2021/05/28 Python