Angular中$state.go页面跳转并传递参数的方法
遇到一个页面跳转的时候,在跳转后的页面获取跳转前页面的数据,我想到用一种是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中
这样就可以将在页面跳转的时候传递数据了。希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!
相关推荐
-
老生常谈angularjs中的$state.go
路由是这么定义的: $stateProvider .state('page1', { url: '/page1', templateUrl: 'views/page1.htm', controller: 'page1Ctrl' }) .state('page2', { url: '/page2/:type', templateUrl: 'views/page2.htm', controller: 'page2Ctrl' }); 用ng-href跳转的话,是这么写的: ng-href="#/pag
-
详解在Angularjs中ui-sref和$state.go如何传递参数
1 ui-sref.$state.go 的区别 ui-sref 一般使用在 <a>...</a>: <a ui-sref="message-list">消息中心</a> $state.go('someState')一般使用在 controller里面: .controller('firstCtrl', function($scope, $state) { $state.go('login'); }); 这两个本质上是一样的东西,我们看ui
-
Angular中$state.go页面跳转并传递参数的方法
遇到一个页面跳转的时候,在跳转后的页面获取跳转前页面的数据,我想到用一种是localstorage,一种用broadcast和on,然后老大说不用这么麻烦,既然都$state.go了直接带参数,这次就介绍一下$state.go页面跳转传递参数. 1.路由页面(注意这里要在路由上添加一个参数用于传递数据,不然在页面跳转的时候会filter) .state("home.workpiece",{ // 跳转前的页面 url:"/workpiece", views: { h
-
微信小程序 navigator 跳转url传递参数
微信小程序 navigator 跳转url传递参数 使用方法说明 (1)传值:在navigator的属性url后拼接?id(参数名字)=要传递的值 (如果多个参数用&分开 &name=value&--.) (2)取值:options 是包含url地址中参数的对象,可以直接 点 获取. 扩展 JS获取web页面地址栏中的参数. https://www.google.co.jp/webhp?sourceid=chrome-instant&ion=1&espv=2&am
-
jQuery实现浏览器之间跳转并传递参数功能【支持中文字符】
本文实例讲述了jQuery实现浏览器之间跳转并传递参数功能.分享给大家供大家参考,具体如下: one.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src="https://cdn.bootcss.com/jquery/2.2.2/jquery.slim.js">&l
-
vue中页面跳转拦截器的实现方法
本文主要给大家介绍的是关于vue页面跳转拦截器的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍: 登录拦截逻辑 第一步:路由拦截 首先在定义路由的时候就需要多添加一个自定义字段requireAuth,用于判断该路由的访问是否需要登录.如果用户已经登录,则顺利进入路由, 否则就进入登录页面.在路由管理页面添加meta字段 import Vue from 'vue' import Router from 'vue-router' Vue.use(Router) const r
-
PHP页面跳转操作实例分析(header方法)
本文实例分析了PHP页面跳转操作.分享给大家供大家参考,具体如下: 跳转 header()为php函数,向浏览器发送指定命令 html: <meta http-equiv="Refresh" content="3;url=other.php"/> 立即跳转: header('Location:other.php'); //file_put_contents('bee.txt','execute'); die; 执行header时候,并不是立即结束,而是会
-
Vue页面跳转动画效果的实现方法
前言 现如今移动端APP对用户体验方面的要求越来越高了,最近致力于用户体验优化,因为需要实现类似APP页面切换的动画效果,百度google搜索资料不是很全,所以自己写文档,在实现效果的基础上,顺便恶补一波VueRouter及CSS过渡动画的知识点,欢迎有兴趣的朋友多多指教. vue-router是Vue.js官方的路由插件,它和vue.js是深度集成的,适合用于构建单页面应用.vue的单页面应用是基于路由和组件的,路由用于设定访问路径,并将路径和组件映射起来.传统的页面应用,是用一些超链接来实现
-
Fragment跳转时传递参数及结果回传的方法(推荐)
今天总结一下Fragment间的参数传递及结果返回的方法. 效果图: 1.点击"加载第二个Fragment按钮",加载出第二个Fragment,同时传递过去参数:"从Fragment1传来的参数"这几个String: 2.当用户点击第二个Fragment中的几个图片时,将点中的结果返回给第一个Fragment,将用户的选择在第一个Fragment显示出来 一.基本架构搭建 首先,我们要把整个架构搭起来,然后再进行参数传递和回传 (一).基本XML构建: 根据上面的效
-
JAVASCRIPT实现的WEB页面跳转以及页面间传值方法
但有时候,需要当某事件触发时,我们先做一些操作,然后再跳转,这时,就要用JAVASCRIPT来实现这一跳转功能. 下面是具体的做法: 一:跳转到新页面,并且是在新窗口中打开时: 复制代码 代码如下: function gogogo() { //do someghing here... window.open("test2.html"); } window是一个javascript对象,可以用它的open方法,需要注意的是,如果这个页面不是一相相对路径,那么要加http://,比如: 复
-
Android Intent实现页面跳转的两种方法
本文实例为大家分享了Intent实现页面跳转的两种的方法,供大家参考,具体内容如下 下图中两个不同的方法就是两种页面之间跳转的情况 1).跳转不返回数据 2).跳转返回数据 实例: 第一种启动方式(跳转不返回数据) 第二种启动方式(跳转返回数据) 先看第一种: 点击第一种启动方式按钮会出现右边的图,然后再点击Button按钮返回左边的界面,TextView中的内容没变. 再看第二种启动方式 不同的是,点击Button按钮返回左边的界面,TextView中的内容变成了你好. 下面是所有代码 And
-
Vue this.$router.push(参数)实现页面跳转操作
很多情况下,我们在执行点击按钮跳转页面之前还会执行一系列方法,这时可以使用 this.$router.push(location) 来修改 url,完成跳转. push 后面可以是对象,也可以是字符串: // 字符串 this.$router.push('/home/first') // 对象 this.$router.push({ path: '/home/first' }) // 命名的路由 this.$router.push({ name: 'home', params: { userId
随机推荐
- 详解JavaScript的AngularJS框架中的作用域与数据绑定
- Java实现顺时针输出螺旋二维数组的方法示例
- 教你如何做批处理文件
- Javascript之面向对象--封装
- JS中mouseup事件丢失的原因与解决办法
- 如何使用C#在PDF文件添加图片印章
- PHP实现通过中文字符比率来判断垃圾评论的方法
- Android开发之图形图像与动画(二)Animation实现图像的渐变/缩放/位移/旋转
- 正则表达式笔记三则
- vue音乐播放器插件vue-aplayer的配置及其使用实例详解
- PHP中ORDER BY子句的详细用法教程
- Linux下查找后门程序 CentOS 查后门程序的shell脚本
- jquery实现漫天雪花飞舞的圣诞祝福雪花效果代码分享
- 一款基于jQuery的图片场景标注提示弹窗特效
- IIS5 ISAPI Extension Back Door
- Android4.0平板开发之隐藏底部任务栏的方法
- java 字符串相减(很简单的一个方法)
- 基于C#实现网络爬虫 C#抓取网页Html源码
- C#中的IEnumerable接口深入研究
- 爱易网络为您提供10M免费ASP空间服务