详解在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 相关文章推荐
2010年最佳jQuery插件整理
Dec 06 Javascript
基于jquery的文字向上跑动类似跑马灯的效果
Sep 22 Javascript
详解AngularJS的通信机制
Jun 18 Javascript
JQuery实现的图文自动轮播效果插件
Jun 19 Javascript
学习JavaScript设计模式之责任链模式
Jan 18 Javascript
基于jQuery的网页影音播放器jPlayer的基本使用教程
Mar 08 Javascript
Angular 应用技巧总结
Sep 14 Javascript
javascript 解决浏览器不支持的问题
Sep 24 Javascript
vue.js指令和组件详细介绍及实例
Apr 06 Javascript
JS基于for语句编写的九九乘法表示例
Jan 04 Javascript
Vue数字输入框组件的使用方法
Oct 19 Javascript
JavaScript声明变量和数据类型的转换
Apr 12 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
php AJAX实例根据邮编自动完成地址信息
2008/11/23 PHP
PHP stripos()函数及注意事项的分析
2013/06/08 PHP
php实现Mongodb自定义方式生成自增ID的方法
2015/03/23 PHP
在html文件中也可以执行php语句的方法
2015/04/09 PHP
检测input每次的输入是否合法遇到汉字输入就有问题
2012/05/23 Javascript
js显示时间 js显示最后修改时间
2013/01/02 Javascript
基于javascipt-dom编程 table对象的使用
2013/04/22 Javascript
js获取指定日期周数以及星期几的小例子
2014/06/27 Javascript
JavaScript实现生成GUID(全局统一标识符)
2014/09/05 Javascript
jQuery实现的导航条切换可显示隐藏
2014/10/22 Javascript
js简单设置与使用cookie的方法
2016/01/22 Javascript
Svg.js实例教程及使用手册详解(一)
2016/05/16 Javascript
基于BootStrap的图片轮播效果展示实例代码
2016/05/23 Javascript
jQuery实现的兼容性浮动层示例
2016/08/02 Javascript
jQuery替换节点用法示例(使用replaceWith方法)
2016/09/08 Javascript
vue.js异步上传文件前后端实现代码
2017/08/22 Javascript
微信小程序实现文件、图片上传功能
2020/08/18 Javascript
MockJs结合json-server模拟后台数据
2020/08/26 Javascript
Vue使用Three.js加载glTF模型的方法详解
2020/06/14 Javascript
Pycharm学习教程(7)虚拟机VM的配置教程
2017/05/04 Python
python遍历文件夹下所有excel文件
2018/01/03 Python
解决python文件双击运行秒退的问题
2019/06/24 Python
简单了解python高阶函数map/reduce
2019/06/28 Python
在python中用print()输出多个格式化参数的方法
2019/07/16 Python
Python实现图像去噪方式(中值去噪和均值去噪)
2019/12/18 Python
在Pytorch中使用Mask R-CNN进行实例分割操作
2020/06/24 Python
python如何快速拼接字符串
2020/10/28 Python
Python+logging输出到屏幕将log日志写入文件
2020/11/11 Python
python实现无边框进度条的实例代码
2020/12/30 Python
Pedro官网:新加坡时尚品牌
2019/08/27 全球购物
我的动漫时代的创业计划书范文
2014/01/27 职场文书
青年志愿者活动方案
2014/08/17 职场文书
校园环保广播稿(3篇)
2014/09/15 职场文书
求职导师推荐信范文
2015/03/27 职场文书
python实现三次密码验证的示例
2021/04/29 Python
在Windows Server 2012上安装 .NET Framework 3.5 所遇到的问题
2022/04/29 Servers