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 相关文章推荐
解决表单中第一个非隐藏的元素获得焦点的一个方案
Oct 26 Javascript
extjs 分页使用jsp传递数据示例
Jul 29 Javascript
jQuery实现的一个自定义Placeholder属性插件
Aug 11 Javascript
用循环或if语句从json中取数据示例
Aug 18 Javascript
AngularJS基础学习笔记之控制器
May 10 Javascript
JavaScript实现自动弹出窗口并自动关闭窗口的方法
Aug 06 Javascript
浅谈vuex之mutation和action的基本使用
Aug 29 Javascript
Webpack 之 babel-loader文件预处理器详解
Mar 23 Javascript
ES6知识点整理之函数对象参数默认值及其解构应用示例
Apr 17 Javascript
vue实现分环境打包步骤(给不同的环境配置相对应的打包命令)
Jun 04 Javascript
绘制微信小程序验证码功能的实例代码
Jan 05 Javascript
js正则匹配markdown里的图片标签的实现
Mar 24 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 has encountered an Access Violation
2007/01/15 PHP
phpmyadmin导入(import)文件限制的解决办法
2009/12/11 PHP
PDO预处理语句PDOStatement对象使用总结
2014/11/20 PHP
PHP 将dataurl转成图片image方法总结
2016/10/14 PHP
javascript css float属性的特殊写法
2008/11/13 Javascript
JavaScript isPrototypeOf和hasOwnProperty使用区别
2010/03/04 Javascript
js 居中漂浮广告
2010/03/21 Javascript
一个基于jquery的图片切换效果
2010/07/06 Javascript
JS中获取数据库中的值的方法
2013/07/14 Javascript
jQuery 三击事件实现代码
2013/09/11 Javascript
JQuery结合CSS操作打印样式的方法
2013/12/24 Javascript
jquery、js调用iframe父窗口与子窗口元素的方法整理
2014/07/31 Javascript
Javascript实现多彩雪花从天降散落效果的方法
2015/02/02 Javascript
JS获取CSS样式(style/getComputedStyle/currentStyle)
2016/01/19 Javascript
网页前端登录js按Enter回车键实现登陆的两种方法
2016/05/10 Javascript
angularjs 源码解析之injector
2016/08/22 Javascript
基于angular实现模拟微信小程序swiper组件
2017/06/11 Javascript
angularjs实现搜索的关键字在正文中高亮出来
2017/06/13 Javascript
对vue.js中this.$emit的深入理解
2018/02/23 Javascript
解决vue单页使用keep-alive页面返回不刷新的问题
2018/03/13 Javascript
小程序云开发部署攻略(图文教程)
2018/10/30 Javascript
Js代码中的span拼接问题解决
2019/11/22 Javascript
javascript实现雪花飘落效果
2020/08/19 Javascript
vue下拉刷新组件的开发及slot的使用详解
2020/12/23 Vue.js
[31:47]夜魇凡尔赛茶话会 第三期01:选手知多少
2021/03/11 DOTA
Python IDLE清空窗口的实例
2018/06/25 Python
Django基础知识 web框架的本质详解
2019/07/18 Python
Python tensorflow实现mnist手写数字识别示例【非卷积与卷积实现】
2019/12/19 Python
python算的上脚本语言吗
2020/06/22 Python
HTML5 Canvas+JS控制电脑或手机上的摄像头实例
2014/05/03 HTML / CSS
世界上最大的乐谱选择:Sheet Music Plus
2020/01/18 全球购物
JSF如何进行表格处理及取值
2012/08/06 面试题
俄罗斯商务邀请函
2014/01/26 职场文书
党员个人自我评价
2015/03/03 职场文书
《金钱的魔力》教学反思
2016/02/20 职场文书
Windows Server 2012配置DNS服务器的方法
2022/04/29 Servers