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 相关文章推荐
formvalidator验证插件中有关ajax验证问题
Jan 04 Javascript
jQuery操作Select选择的Text和Value(获取/设置/添加/删除)
Mar 06 Javascript
深入document.write()与HTML4.01的非成对标签的详解
May 08 Javascript
使用iframe window的scroll方法控制iframe页面滚动
Mar 05 Javascript
js调用后台、后台调用前台等方法总结
Apr 17 Javascript
jQuery切换网页皮肤并保存到Cookie示例代码
Jun 16 Javascript
javascript 判断整数方法分享
Dec 16 Javascript
JavaScript在浏览器标题栏上显示当前日期和时间的方法
Mar 19 Javascript
Angular 5.x 学习笔记之Router(路由)应用
Apr 08 Javascript
vue-resource:jsonp请求百度搜索的接口示例
Nov 09 Javascript
jQuery实现的上拉刷新功能组件示例
May 01 jQuery
vue3使用vue-router的完整步骤记录
Jun 20 Vue.js
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+SqlServer实现分页显示
2006/10/09 PHP
杏林同学录(四)
2006/10/09 PHP
openflashchart 2.0 简单案例php版
2012/05/21 PHP
PHP如何通过表单直接提交大文件详解
2019/01/08 PHP
学习jquery之一
2007/04/27 Javascript
JS IE和FF兼容性问题汇总
2009/02/09 Javascript
Javascript封装DOMContentLoaded事件实例
2014/06/12 Javascript
Angular中的Promise对象($q介绍)
2015/03/03 Javascript
在浏览器中打开或关闭JavaScript的方法
2015/06/03 Javascript
jQuery实现选中弹出窗口选择框内容后赋值给文本框的方法
2015/11/23 Javascript
基于Node.js实现nodemailer邮件发送
2016/01/26 Javascript
怎样判断jQuery当前元素是隐藏还是显示
2016/11/23 Javascript
JS中的phototype详解
2017/02/04 Javascript
详解Vue-cli 创建的项目如何跨域请求
2017/05/18 Javascript
angular过滤器实现排序功能
2017/06/27 Javascript
JavaScript贪吃蛇小组件实例代码
2017/08/20 Javascript
微信小程序云开发之使用云数据库
2019/05/17 Javascript
JavaScript 实现同时选取多个时间段的方法
2019/10/17 Javascript
[51:26]VP vs VG 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
python实现的阳历转阴历(农历)算法
2014/04/25 Python
python多进程使用及线程池的使用方法代码详解
2018/10/24 Python
python画双y轴图像的示例代码
2019/07/07 Python
Python流程控制 if else实现解析
2019/09/02 Python
安装python及pycharm的教程图解
2019/10/10 Python
python+mysql实现个人论文管理系统
2019/10/25 Python
pygame实现打字游戏
2021/02/19 Python
Python 处理日期时间的Arrow库使用
2020/08/18 Python
Booking.com荷兰:全球酒店网上预订
2017/08/22 全球购物
Bealls Florida百货商店:生活服饰、家居装饰和鞋子
2018/02/23 全球购物
项目合作意向书范本
2014/04/01 职场文书
民主评议党员工作总结
2014/10/20 职场文书
幼儿园迎新生欢迎词
2015/09/30 职场文书
班主任远程培训研修日志
2015/11/13 职场文书
Python异常类型以及处理方法汇总
2021/06/05 Python
Go语言特点及基本数据类型使用详解
2022/03/21 Golang
Win10 最新稳定版本 21H2开始推送
2022/04/19 数码科技