详解在Angularjs中ui-sref和$state.go如何传递参数


Posted in Javascript onApril 24, 2017

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-sref的源码:

...
element.bind("click", function(e) {
  var button = e.which || e.button;
  if ( !(button > 1 || e.ctrlKey || e.metaKey || e.shiftKey || element.attr('target')) ) {

   var transition = $timeout(function() {
    // HERE we call $state.go inside of ui-sref
    $state.go(ref.state, params, options);
   });

ui-sref最后调用的还是$state.go()方法

2 如何传递参数

首先,要在目标页面定义接受的参数:

详解在Angularjs中ui-sref和$state.go如何传递参数

传参,

ui-sref:

详解在Angularjs中ui-sref和$state.go如何传递参数

$state.go:

详解在Angularjs中ui-sref和$state.go如何传递参数

接收参数,

在目标页面的controller里注入$stateParams,然后 "$stateParams.参数名" 获取

详解在Angularjs中ui-sref和$state.go如何传递参数

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
use jscript List Installed Software
Jun 11 Javascript
json 实例详细说明教程
Oct 31 Javascript
jQuery学习笔记之jQuery的动画
Dec 22 Javascript
JavaScript自定义日期格式化函数详细解析
Jan 14 Javascript
js 验证身份证信息有效性
Mar 28 Javascript
BootStrap+Angularjs+NgDialog实现模式对话框
Aug 24 Javascript
JavaScript仿聊天室聊天记录
Dec 27 Javascript
微信小程序实现image组件图片自适应宽度比例显示的方法
Jan 16 Javascript
angular.js实现列表orderby排序的方法
Oct 02 Javascript
Js和VUE实现跑马灯效果
May 25 Javascript
使用typescript快速开发一个cli的实现示例
Dec 09 Javascript
element-ui点击查看大图的方法示例
Dec 14 Javascript
JS实现获取图片大小和预览的方法完整实例【兼容IE和其它浏览器】
Apr 24 #Javascript
angular中实现控制器之间传递参数的方式
Apr 24 #Javascript
使用vue框架 Ajax获取数据列表并用BootStrap显示出来
Apr 24 #Javascript
JS实现加载和读取XML文件的方法详解
Apr 24 #Javascript
JS简单获取日期相差天数的方法
Apr 24 #Javascript
Angular.js中控制器之间的传值详解
Apr 24 #Javascript
jquery submit()不能提交表单的解决方法
Apr 24 #jQuery
You might like
Zend引擎的发展 [15]
2006/10/09 PHP
php Imagick获取图片RGB颜色值
2014/07/28 PHP
PHP数组相加操作及与array_merge的区别浅析
2016/11/26 PHP
PHP实现的回溯算法示例
2017/08/15 PHP
PHP以json或xml格式返回请求数据的方法
2018/05/31 PHP
jquery对dom的操作常用方法整理
2013/06/25 Javascript
js 得到文件后缀(通过正则实现)
2013/07/08 Javascript
javascript判断非数字的简单例子
2013/07/18 Javascript
js获取上传文件大小示例代码
2014/04/10 Javascript
jQuery 获取兄弟元素的几种不错方法
2014/05/23 Javascript
自己动手写的jquery分页控件(非常简单实用)
2015/10/28 Javascript
JS实现的倒计时恢复按钮点击功能【可用于协议阅读倒计时】
2018/04/19 Javascript
node app 打包工具pkg的具体使用
2019/01/17 Javascript
一份python入门应该看的学习资料
2018/04/11 Python
详解Python传入参数的几种方法
2019/05/16 Python
在Mac中配置Python虚拟环境过程解析
2020/06/22 Python
CSS3实现曲线阴影和翘边阴影
2016/05/03 HTML / CSS
美国最大的香水连锁店官网:Perfumania
2016/08/15 全球购物
迪卡侬英国官网:Decathlon英国
2017/04/08 全球购物
HEMA英国:荷兰原创设计
2018/08/28 全球购物
Eclipse面试题
2014/03/22 面试题
编码实现字符串转整型的函数
2012/06/02 面试题
计算机专业自荐信
2013/10/14 职场文书
学院书画协会部门职责
2013/11/28 职场文书
四好少年事迹材料
2014/01/12 职场文书
单位实习证明怎么写
2014/01/17 职场文书
知识竞赛主持词
2014/03/26 职场文书
运动会加油口号
2014/06/07 职场文书
网吧七夕活动策划方案
2014/08/31 职场文书
学用政策心得体会
2014/09/10 职场文书
2015年招生工作总结
2015/05/04 职场文书
企业内部管理控制:银行存款控制制度范本
2020/01/10 职场文书
解决hive中导入text文件遇到的坑
2021/04/07 Python
Python Pandas知识点之缺失值处理详解
2021/05/11 Python
排查并解决Oracle sysaux表空间异常增长
2022/04/20 Oracle
IIS服务器中设置HTTP重定向访问HTTPS
2022/04/29 Servers