详解在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 相关文章推荐
区分JS中的undefined,null,&quot;&quot;,0和false
Mar 08 Javascript
JAVASCRIPT style 中visibility和display之间的区别
Jan 22 Javascript
jQuery学习笔记之 Ajax操作篇(三) - 过程处理
Jun 23 Javascript
jQuery往textarea中光标所在位置插入文本的方法
Jun 26 Javascript
修改 bootstrap table 默认detailRow样式的实例代码
Jul 21 Javascript
Vue 2.5 Level E 发布了: 新功能特性一览
Oct 24 Javascript
vue 使用Jade模板写html,stylus写css的方法
Feb 23 Javascript
关闭Vue计算属性自带的缓存功能方法
Mar 02 Javascript
vuex中的 mapState,mapGetters,mapActions,mapMutations 的使用
Apr 13 Javascript
使用express来代理服务的方法
Jun 21 Javascript
echarts实现获取datazoom的起始值(包括x轴和y轴)
Jul 20 Javascript
vue-router定义元信息meta操作
Dec 07 Vue.js
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遍历某个目录下的所有文件和子文件夹的实现代码
2013/06/28 PHP
PHP检测用户语言的方法
2015/06/15 PHP
jQuery技巧大放送 学习jquery的朋友可以看下
2009/10/14 Javascript
基于Jquery的回车成tab焦点切换效果代码(Enter To Tab )
2010/11/14 Javascript
jquery.messager.js插件导致页面抖动的解决方法
2013/07/14 Javascript
js传参数受特殊字符影响错误的解决方法
2013/10/21 Javascript
一个JavaScript去除字符串末尾的空白实例代码
2014/09/22 Javascript
个人总结的一些JavaScript技巧、实用函数、简洁方法、编程细节
2015/06/10 Javascript
仿Angular Bootstrap TimePicker创建分钟数-秒数的输入控件
2016/07/01 Javascript
BootStrap实现邮件列表的分页和模态框添加邮件的功能
2016/10/13 Javascript
EasyUI学习之DataGird分页显示数据
2016/12/29 Javascript
jQuery实现文档树效果
2017/02/20 Javascript
完美实现js选项卡切换效果(一)
2017/03/08 Javascript
基于vue2框架的机器人自动回复mini-project实例代码
2017/06/13 Javascript
JavaScript Drum Kit 指南(纯 JS 模拟敲鼓效果)
2017/07/23 Javascript
基于Vue实现拖拽效果
2018/04/27 Javascript
jQuery操作事件完整实例分析
2020/01/10 jQuery
JS面向对象之多选框实现
2020/01/17 Javascript
小程序自动化测试的示例代码
2020/08/11 Javascript
[53:03]Optic vs TNC 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
在Python中关于中文编码问题的处理建议
2015/04/08 Python
Python中的rfind()方法使用详解
2015/05/19 Python
Python的Django框架中的表单处理示例
2015/07/17 Python
python在文本开头插入一行的实例
2018/05/02 Python
Django中的用户身份验证示例详解
2019/08/07 Python
浅析Python迭代器的高级用法
2020/07/16 Python
python实现一个简单RPC框架的示例
2020/10/28 Python
英国领先的珍珠首饰品牌:Orchira
2016/09/11 全球购物
中华魂演讲稿
2014/05/13 职场文书
服务宗旨标语
2014/07/01 职场文书
资源环境与城乡规划管理专业自荐书
2014/09/26 职场文书
教师自我剖析材料(四风问题)
2014/09/30 职场文书
工作业绩不及格检讨书
2014/10/28 职场文书
2014年平安建设工作总结
2014/11/19 职场文书
2016年质量月活动总结报告
2016/04/05 职场文书
opencv检测动态物体的实现
2021/07/21 Python