angular 跳转页面时传参
2016-07-29 12:10
323 查看
首先,你需要已经配置过你的rout,比如:
其中注意第二个地址信息中的params属性,这个就是你要接受参数的对象,以key :value的形式定义
而在跳转页面时,两个方法都可以传参,一种是直接写在html中
此时传参跟在页面地址的后面
第二种就是写在controller中
同样参数写在地址后面,以对象的形式
传过去的参数,需要在目标页面的controller中用$stateParams接收,改方法需要提前注入
$stateProvider .state('firstPage',{ url:'/Page/firstPage', templateUrl: 'Page/views/firstPage.html', controller: 'firstPageCtrl' //dependencies: ['service/vipSeachService'] }) .state('secPage', { params:{'message':null}, url: '/Page/secPage', templateUrl: 'Page/views/secPage.html', controller: 'secPageCtrl' })
其中注意第二个地址信息中的params属性,这个就是你要接受参数的对象,以key :value的形式定义
而在跳转页面时,两个方法都可以传参,一种是直接写在html中
<a ui-sref="sec-page">跳转第二页</a>
此时传参跟在页面地址的后面
<a ui-sref="sec-page({message:messageId})">跳转第二页</a>
第二种就是写在controller中
.controller('firstPageCtrl', function($scope, $state) { $state.go('secPage');
});
同样参数写在地址后面,以对象的形式
.controller('firstPageCtrl', function($scope, $state) { $state.go('secPage',{message:messageId}); });
传过去的参数,需要在目标页面的controller中用$stateParams接收,改方法需要提前注入
.controller('secPageCtrl', function($scope, $state,$stateParams) { var test=$stateParams.message; });
相关文章推荐
- 页面跳转传参:参数过长(cookie,url , AngularJs controller 传参实现)
- Angular 页面跳转时传参问题
- Angular页面传参办法
- webapp mui & HTML5+ (四) 之 窗口(页面初始化、跳转、传参)
- angular-页面跳转传递参数
- angular和路由实现页面跳转/姓名筛选/年龄区间查找/单/批量删除
- ionicCLI Angular页面跳转
- vue-router实现几级页面跳转及传参
- window.location.href跳转页面,问号传参并将参数转为json对象
- React-Router传参取值页面跳转
- ionic2 页面跳转传参
- js实现静态页面跳转传参
- javascript传值和页面跳转传值(ASP.NET页面传参的三种方法)
- 微信小程序页面跳转传参
- ReactNative官网例子练习(五)——页面跳转传参
- vue-router实现登录和跳转到指定页面,vue-router 传参
- aspx页面跳转中各种传参规范
- (随笔记录)页面跳转以及传参的三种方式
- 跳转页面 传参
- html局部页面刷新和跳转传参