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 js cookie的存储,获取和删除
Dec 29 Javascript
JavaScript面向对象之体会[总结]
Nov 13 Javascript
Javascript 继承实现例子
Aug 12 Javascript
ASP.NET jQuery 实例10 动态修改hyperlink的URL值
Feb 03 Javascript
JavaScript?Apple设备检测示例代码
Nov 15 Javascript
JavaScript获取Url里的参数
Dec 18 Javascript
javascript伸缩型菜单实现代码
Nov 16 Javascript
理解javascript对象继承
Apr 17 Javascript
浅谈JavaScript 浏览器对象
Jun 03 Javascript
JS函数节流和函数防抖问题分析
Dec 18 Javascript
使用Node.js在深度学习中做图片预处理的方法
Sep 18 Javascript
原生js实现滑块区间组件
Jan 20 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
Protoss建筑一览
2020/03/14 星际争霸
php中$this->含义分析
2009/11/29 PHP
php set_time_limit(0) 设置程序执行时间的函数
2010/05/26 PHP
详解WordPress中给链接添加查询字符串的方法
2015/12/18 PHP
php读取和保存base64编码的图片内容
2017/04/22 PHP
Laravel 手动开关 Eloquent 修改器的操作方法
2019/12/30 PHP
php高性能日志系统 seaslog 的安装与使用方法分析
2020/02/29 PHP
JavaScript 数组的 uniq 方法
2008/01/23 Javascript
jquery实现的一个导航滚动效果具体代码
2013/05/27 Javascript
jquery 利用show和hidden实现级联菜单示例代码
2013/08/09 Javascript
node.js中的fs.fchown方法使用说明
2014/12/16 Javascript
BootStrap的alert提示框的关闭后再显示怎么解决
2016/05/17 Javascript
浅谈javascript中的加减时间
2016/07/12 Javascript
简单实现js倒计时功能
2017/02/13 Javascript
ajax +NodeJS 实现图片上传实例
2017/06/06 NodeJs
vue watch深度监听对象实现数据联动效果
2018/08/16 Javascript
Angular2实现的秒表及改良版示例
2019/05/10 Javascript
在vue项目实现一个ctrl+f的搜索功能
2020/02/28 Javascript
在Python中使用AOP实现Redis缓存示例
2017/07/11 Python
浅谈Tensorflow由于版本问题出现的几种错误及解决方法
2018/06/13 Python
用Python分析3天破10亿的《我不是药神》到底神在哪?
2018/07/12 Python
Django 限制用户访问频率的中间件的实现
2018/08/23 Python
在Python中pandas.DataFrame重置索引名称的实例
2018/11/06 Python
使用python实现mqtt的发布和订阅
2019/05/05 Python
python计算导数并绘图的实例
2020/02/29 Python
基于Python3.7.1无法导入Numpy的解决方式
2020/03/09 Python
CSS3模块的目前的状况分析
2010/02/24 HTML / CSS
中国领先的专业演出票务网:永乐票务
2016/08/29 全球购物
抽象方法、抽象类怎样声明
2014/10/25 面试题
大学生自助营养快餐店创业计划书
2014/01/13 职场文书
幼儿园消防安全制度
2014/01/26 职场文书
廉洁教育学习材料
2014/05/19 职场文书
商务邀请函
2015/01/30 职场文书
辩论赛开场白大全(主持人+辩手)
2015/05/29 职场文书
2016年中学植树节活动总结
2016/03/16 职场文书
导游词之杭州西湖
2019/09/19 职场文书