Angular 页面跳转时传参问题


Posted in Javascript onAugust 01, 2016

首先,你需要已经配置过你的rout,比如:

$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;
});

以上所述是小编给大家介绍的Angular 页面跳转时传参问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
利用WebBrowser彻底解决Web打印问题(包括后台打印)
Jun 22 Javascript
bgsound 背景音乐 的一些常用方法及特殊用法小结
May 11 Javascript
jQuery插件Zclip实现完美兼容个浏览器点击复制内容到剪贴板
Apr 30 Javascript
jQuery支持添加事件的日历特效代码分享(3种样式)
Aug 24 Javascript
js右下角弹出提示框示例代码
Jan 12 Javascript
详解js中Json的语法与格式
Nov 22 Javascript
Bootstrap源码解读按钮(5)
Dec 23 Javascript
jQuery实现 RadioButton做必选校验功能
Jun 15 jQuery
JS禁止浏览器右键查看元素或按F12审查元素自动关闭页面示例代码
Sep 07 Javascript
利用SpringMVC过滤器解决vue跨域请求的问题
Feb 10 Javascript
详解js中Array的方法及技巧
Sep 12 Javascript
uni-app 微信小程序授权登录的实现步骤
Feb 18 Javascript
AngularJS基础 ng-copy 指令实例代码
Aug 01 #Javascript
1秒50万字!js实现关键词匹配
Aug 01 #Javascript
jQuery实现点击表格单元格就可以编辑内容的方法【测试可用】
Aug 01 #Javascript
JS实现数字格式千分位相互转换方法
Aug 01 #Javascript
AngularJS ng-controller 指令简单实例
Aug 01 #Javascript
js实现千分符和保留几位小数的简单实例
Aug 01 #Javascript
浅谈jQuery中ajaxPrefilter的应用
Aug 01 #Javascript
You might like
PHP中最容易忘记的一些知识点总结
2013/04/28 PHP
php_screw安装使用教程(另一个PHP代码加密实现)
2014/05/29 PHP
PHP中读取文件的8种方法和代码实例
2014/08/05 PHP
SCP远程VPS快速搬家和WDCP升级php5.3安装memcached和eaccelerator教程
2017/07/27 PHP
简单实现php上传文件功能
2017/09/21 PHP
使用TextRange获取输入框中光标的位置的代码
2007/03/08 Javascript
jqPlot jquery的页面图表绘制工具
2009/07/25 Javascript
ExtJS 设置级联菜单的默认值
2010/06/13 Javascript
网站如何做到完全不需要jQuery也可以满足简单需求
2013/06/27 Javascript
innerHTML,outerHTML,innerText,outerText的用法及区别解析
2013/12/16 Javascript
window.open 以post方式传递参数示例代码
2014/02/27 Javascript
js实现完美兼容各大浏览器的人民币大小写相互转换
2015/10/29 Javascript
易操作的jQuery表单提示插件
2015/12/01 Javascript
数组Array的一些方法(总结)
2017/02/17 Javascript
jQuery实现的中英文切换功能示例
2019/01/11 jQuery
详解JavaScript对数组操作(添加/删除/截取/排序/倒序)
2019/04/28 Javascript
JavaScript Window窗口对象属性和使用方法
2020/01/19 Javascript
[56:48]FNATIC vs EG 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
py中的目录与文件判别代码
2008/07/16 Python
python获取android设备的GPS信息脚本分享
2015/03/06 Python
SQLite3中文编码 Python的实现
2017/01/11 Python
TensorFlow平台下Python实现神经网络
2018/03/10 Python
解决Shell执行python文件,传参空格引起的问题
2018/10/30 Python
基于Python实现签到脚本过程解析
2019/10/25 Python
Spring Boot中使用IntelliJ IDEA插件EasyCode一键生成代码详细方法
2020/03/20 Python
Python判断远程服务器上Excel文件是否被人打开的方法
2020/07/13 Python
分享30个新鲜的CSS3打造的精美绚丽效果(附演示下载)
2012/12/28 HTML / CSS
使用HTML5和CSS3制作一个模态框的示例
2018/03/07 HTML / CSS
在校学生职业规划范文
2014/01/08 职场文书
中专生职业生涯规划书范文
2014/01/10 职场文书
电大本科自我鉴定
2014/02/05 职场文书
法制宣传标语集锦
2014/06/25 职场文书
房地产置业顾问岗位职责
2015/04/11 职场文书
记者节感言
2015/08/03 职场文书
十二月早安励志心语大全
2019/12/03 职场文书
MySQL定时备份数据库(全库备份)的实现
2021/09/25 MySQL