Angular.js跨controller实现参数传递的两种方法


Posted in Javascript onFebruary 20, 2017

前言

由于controllers之间不共享scope,如果希望在controllers之间传递参数,可能需要通过其他的方式实现,以下是当前我用到的两种在controllers之间传递参数的方法。

注:参考文章Sharing Data Between Angular Controllers

一、service

可以写一个包含get/set的service,取参数/赋参数

.factory('paramService',function(){
 return {
 result:[],
 getResult:function(){
 return this.result;
 },
 setResult:function(res){
 this.result = res;
 }
 };
})

然后可以在controllerOne中赋值,在controllerTwo中取值

// 赋值
.controller('one',function(paramService){
 paramService.setResult('one');
})

// 取值
.controller('two',function(paramService){
 var param = paramService.getResult();
})

二、$stateParams

第二种方法用于路由间传递参数,用途也比较广泛,使用场景比较多

// 传参
.state('one',{
 url:'one',
 controller:'one',
 template:'one.html',
 params:{
 name:'john'
 }
})

// 取参
.controller('one',function($stateParams){
 var name = $stateParams.name;
})

others/localStorage

其他方法可以使用一些h5的小技巧,比如使用localStorage来存参/取参,其他的方法,暂时没想到也没用到,有待后续补充.

好了,以上就是这篇文章的全部内容了,希望本文的内容对大家学习或者使用Angular能带来一定的帮助,如果有疑问大家可以留言交流。

Javascript 相关文章推荐
JavaScript入门教程(8) Location地址对象
Jan 31 Javascript
javascript json2 使用方法
Mar 16 Javascript
在网页中使用document.write时遭遇的奇怪问题
Aug 24 Javascript
33个优秀的 jQuery 图片展示插件分享
Mar 14 Javascript
javascript获取选中的文本的方法代码
Oct 30 Javascript
JSON无限折叠菜单编写实例
Dec 16 Javascript
jQuery中ajax的使用与缓存问题的解决方法
Dec 19 Javascript
JS获取input file绝对路径的方法(推荐)
Aug 02 Javascript
全面解析vue router 基本使用(动态路由,嵌套路由)
Sep 02 Javascript
通过实例讲解JS如何防抖动
Jun 15 Javascript
Vue实现按钮级权限方案
Nov 21 Javascript
vue 将多个过滤器封装到一个文件中的代码详解
Sep 05 Javascript
Bootstrap table右键功能实现方法
Feb 20 #Javascript
BootstrapTable refresh 方法使用实例简单介绍
Feb 20 #Javascript
Bootstrap table 定制提示语的加载过程
Feb 20 #Javascript
bootstrapValidator 重新启用提交按钮的方法
Feb 20 #Javascript
原生js实现轮播图的示例代码
Feb 20 #Javascript
深入理解Javascript中的观察者模式
Feb 20 #Javascript
浅谈js中function的参数默认值
Feb 20 #Javascript
You might like
set_include_path和get_include_path使用及注意事项
2013/02/02 PHP
Zend的MVC机制使用分析(二)
2013/05/02 PHP
ThinkPHP中U方法的使用浅析
2014/06/13 PHP
ThinkPHP结合AjaxFileUploader实现无刷新文件上传的方法
2014/10/29 PHP
Symfony2使用第三方库Upload制作图片上传实例详解
2016/02/04 PHP
thinkPHP分页功能实例详解
2017/05/05 PHP
PHP简单实现二维数组的矩阵转置操作示例
2017/11/24 PHP
Yii2 queue的队列使用详解
2019/07/19 PHP
php7连接MySQL实现简易查询程序的方法
2020/10/13 PHP
prototype与jquery下Ajax实现的差别
2009/09/13 Javascript
JavaScript 浏览器验证代码(来自discuz)
2010/07/17 Javascript
图片上传插件jquery.uploadify详解
2013/11/15 Javascript
jquery动态添加删除(tr/td)
2015/02/09 Javascript
JS实现table表格数据排序功能(可支持动态数据+分页效果)
2016/05/26 Javascript
jQuery hover事件简单实现同时绑定2个方法
2016/06/07 Javascript
Jquery组件easyUi实现选项卡切换示例
2016/08/23 Javascript
JS开发常用工具函数(小结)
2019/07/04 Javascript
vue 遮罩层阻止默认滚动事件操作
2020/07/28 Javascript
python中解析json格式文件的方法示例
2017/05/03 Python
Python贪心算法实例小结
2018/04/22 Python
在cmd命令行里进入和退出Python程序的方法
2018/05/12 Python
numpy linalg模块的具体使用方法
2019/05/26 Python
Django实现发送邮件找回密码功能
2019/08/12 Python
python模拟点击网页按钮实现方法
2020/02/25 Python
HTML5实现WebSocket协议原理浅析
2014/07/07 HTML / CSS
如何用PHP实现邮件发送
2012/12/26 面试题
JSF面试题:如何管量web层中的Bean,用什么标签。如何通过jsp页面与Bean绑定在一起进行处理?
2012/10/05 面试题
JAVA代码查错题
2014/10/10 面试题
私有程序集与共享程序集有什么区别
2013/04/05 面试题
初中校园之声广播稿
2014/01/15 职场文书
大学生应聘求职信
2014/05/26 职场文书
演讲比赛策划方案
2014/06/11 职场文书
科级干部群众路线教育实践活动对照检查材料思想汇报
2014/09/20 职场文书
教师自我剖析材料(群众路线)
2014/09/29 职场文书
滞留工资返还协议书
2014/10/19 职场文书
关于vue中如何监听数组变化
2021/04/28 Vue.js