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 相关文章推荐
<script defer> defer 是什么意思
May 10 Javascript
预加载css或javascript的js代码
Apr 23 Javascript
jquery实现点击向下展开菜单项(伸缩导航)效果
Aug 22 Javascript
JavaScript实现审核流程状态的动态显示进度条
Mar 15 Javascript
详解webpack 如何集成第三方js库
Jun 29 Javascript
关于预加载InstantClick的问题解决方法
Sep 12 Javascript
基于vue展开收起动画的示例代码
Jul 05 Javascript
JavaScript捕捉事件和阻止冒泡事件实例分析
Aug 03 Javascript
深入剖析JavaScript instanceof 运算符
Jun 14 Javascript
详解mpvue实现对苹果X安全区域的适配
Jul 31 Javascript
如何解决日期函数new Date()浏览器兼容性问题
Sep 11 Javascript
如何在selenium中使用js实现定位
Aug 18 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
php之Memcache学习笔记
2013/06/17 PHP
ThinkPHP5 验证器的具体使用
2018/05/31 PHP
tp5框架使用composer实现日志记录功能示例
2019/01/10 PHP
PHP pthreads v3使用中的一些坑和注意点分析
2020/02/21 PHP
CI框架简单分页类用法示例
2020/06/06 PHP
再次更新!MSClass (Class Of Marquee Scroll通用不间断滚动JS封装类 Ver 1.6)
2007/02/05 Javascript
一些Javascript的IE和Firefox(火狐)兼容性的问题总结及常用例子
2009/05/21 Javascript
JS获取dom 对象 ajax操作 读写cookie函数
2009/11/18 Javascript
20个非常棒的Jquery实用工具 国外文章
2010/01/01 Javascript
js 异步处理进度条
2010/04/01 Javascript
关于jquery append() html时的小问题的解决方法
2010/12/16 Javascript
html中使用javascript调用本地程序(exe、doc等)实现代码
2013/04/26 Javascript
js获取IFRAME当前的URL的方法
2013/11/13 Javascript
jquery获取easyui日期控件的值实现方法
2016/11/09 Javascript
node跨域转发 express+http-proxy-middleware的使用
2018/05/31 Javascript
JS实现倒计时图文效果
2018/11/17 Javascript
vue项目前端埋点的实现
2019/03/06 Javascript
JS实现的检验身份证格式并输出出生日期,年龄,性别,出生地示例
2019/05/17 Javascript
微信小程序实现树莓派(raspberry pi)小车控制
2020/02/12 Javascript
一起深入理解js中的事件对象
2021/02/06 Javascript
[02:23]2014DOTA2国际邀请赛中国战队回顾
2014/08/01 DOTA
[01:25]DOTA2自定义游戏灵园鬼域等你踏足
2015/10/30 DOTA
python代码 if not x: 和 if x is not None: 和 if not x is None:使用介绍
2016/09/21 Python
python 迭代器和iter()函数详解及实例
2017/03/21 Python
在python中实现调用可执行文件.exe的3种方法
2019/07/07 Python
Django 过滤器汇总及自定义过滤器使用详解
2019/07/19 Python
python快速编写单行注释多行注释的方法
2019/07/31 Python
PyCharm第一次安装及使用教程
2020/01/08 Python
python GUI库图形界面开发之PyQt5布局控件QGridLayout详细使用方法与实例
2020/03/06 Python
Python getattr()函数使用方法代码实例
2020/08/10 Python
Python爬虫之Selenium实现关闭浏览器
2020/12/04 Python
联谊活动策划书
2014/01/26 职场文书
2014年庆祝国庆65周年演讲稿
2014/09/21 职场文书
高中班主任评语
2014/12/30 职场文书
2016干部作风整顿心得体会
2016/01/22 职场文书
7个你应该知道的JS原生错误类型
2021/04/29 Javascript