AngularJs Managing Service Dependencies详解


Posted in Javascript onSeptember 02, 2016

angular允许service将其他service声明为依赖,使用在自身实例化时使用的构造函数中。

为了声明依赖,我们需要在工厂方法声明中指定它们,并且在工厂方法中通过$inject属性(字符串标识数组)或者使用array notation。

通常$inject属性声明可以被丢弃(即https://3water.com/article/91815.htm中提到的隐式依赖注入,但这个是实验属性,在而且在压缩混淆后会失效,慎用!)。

使用array notation

function myModuleCfgFn ($provide) {
  $provide.factory(‘myService',[‘dep1','dep2',function(dep1,dep2){}]);
}

使用$inject属性   

function myModuleCfgFn($provide) {
   var myServiceFactory = function(dep1, dep2) {};
   myServiceFactory.$inject = ['dep1', 'dep2'];
   $provide.factory('myService', myServiceFactory);
 }

使用隐式DI(不兼容压缩混淆的代码)

function myModuleCfgFn($provide) {
$provide.factory('myService', function(dep1, dep2) {});
}

       下面有一个例子,里面有两个service,它们之间存在依赖关系,以及其他一些angular提供的service。

/**
 * batchLog service 允许消息在内存中形成队列,50秒flush一次。
 *
 * @param {*} message Message to be logged.
 */
 function batchLogModule($provide){
 $provide.factory('batchLog', ['$timeout', '$log', function($timeout, $log) {
 

var messageQueue = [];
 

function log() {
 


if (messageQueue.length) {
 



$log('batchLog messages: ', messageQueue);
 



messageQueue = [];
 


}
 


$timeout(log, 50000);
 

}
 

log(); 
 

return function(message) {
 


messageQueue.push(message);
 

}
 
}]);
 
/**
 
* routeTemplateMonitor监控每一个route的变化,每个比阿奴啊都会通过batchLog service记录下来
 
*/
 
$provide.factory('routeTemplateMonitor',
 

['$route', 'batchLog', '$rootScope',
 

function($route, batchLog, $rootScope) {
 


$rootScope.$on('$routeChangeSuccess', function() {
 



batchLog($route.current ? $route.current.template : null);
 


});
 
}]);
 }
 // 获得主service,运行应用(监听事件)

angular.injector([batchLogModule]).get('routeTemplateMonitor');

例子中需要注意的事项:

  1. batchLog service依赖angular内置的$timeout(http://docs.angularjs.org/api/ng.$timeout)与$log services(http://docs.angularjs.org/api/ng.$log),实现通过console.log批量log消息。
  2. routeTemplateMonitor service依赖内置的$route(http://docs.angularjs.org/api/ng.$route) service与我们自定义的batchLog service。
  3. 我们两个service都使用工厂方法签名以及array notation来注释inject,声明它们的依赖。array中的字符串标识的顺序与工厂方法签名(参数)中的顺序必须一致,这十分重要。除非在工厂方法参数中使用隐式依赖声明,否则,injector将根据array中字符串的顺序决定inject哪一个服务。

以上就是关于AngularJs Managing Service Dependencies 资料的整理,后续继续添加相关资料,谢谢大家对本站的支持!

Javascript 相关文章推荐
javascript 模式设计之工厂模式学习心得
Apr 27 Javascript
跨域请求之jQuery的ajax jsonp的使用解惑
Oct 09 Javascript
javascript使用avalon绑定实现checkbox全选
May 06 Javascript
JavaScript中字符串(string)转json的2种方法
Jun 25 Javascript
浅谈JavaScript 的执行顺序
Aug 07 Javascript
chrome调试javascript详解
Oct 21 Javascript
JS、jQuery中select的用法详解
Apr 21 Javascript
Node.js环境下JavaScript实现单链表与双链表结构
Jun 12 Javascript
JS多物体实现缓冲运动效果示例
Dec 20 Javascript
使用Browserify来实现CommonJS的浏览器加载方法
May 14 Javascript
webpack-dev-server自动更新页面方法
Feb 22 Javascript
详解VUE单页应用骨架屏方案
Jan 17 Javascript
AngularJs Injecting Services Into Controllers详解
Sep 02 #Javascript
AngularJs  Creating Services详解及示例代码
Sep 02 #Javascript
利用jQuery实现打字机字幕效果实例代码
Sep 02 #Javascript
AngularJs  Using $location详解及示例代码
Sep 02 #Javascript
基于JS实现类似支付宝支付密码输入框
Sep 02 #Javascript
JavaScript中Number对象的toFixed() 方法详解
Sep 02 #Javascript
Node.js实现兼容IE789的文件上传进度条
Sep 02 #Javascript
You might like
PHP基于ORM方式操作MySQL数据库实例
2017/06/21 PHP
在Yii2特定页面如何禁用调试工具栏Debug Toolbar详解
2017/08/07 PHP
JavaScript中使用构造函数实现继承的代码
2010/08/12 Javascript
jQuery源码中的chunker 正则过滤符分析
2012/07/31 Javascript
关于全局变量和局部变量的那些事
2013/01/11 Javascript
js冒泡法和数组转换成字符串示例代码
2013/08/14 Javascript
原生js实现addclass,removeclass,toggleclasss实例
2016/11/24 Javascript
基于JavaScript实现验证码功能
2017/04/01 Javascript
Javascript实现数组中的元素上下移动
2017/04/28 Javascript
详解react-router 4.0 下服务器如何配合BrowserRouter
2017/12/29 Javascript
Vue 配合eiement动态路由,权限验证的方法
2018/09/26 Javascript
js console.log打印对象时属性缺失的解决方法
2019/05/23 Javascript
基于jquery ajax的多文件上传进度条过程解析
2019/09/11 jQuery
Vue+Node服务器查询Mongo数据库及页面数据传递操作实例分析
2019/12/20 Javascript
JS实现的定时器展示简单秒表、页面弹框及跳转操作完整示例
2020/01/26 Javascript
使用Django2快速开发Web项目的详细步骤
2019/01/06 Python
python处理自动化任务之同时批量修改word里面的内容的方法
2019/08/23 Python
Jupyter Notebook折叠输出的内容实例
2020/04/22 Python
python通过cython加密代码
2020/12/11 Python
Python plt 利用subplot 实现在一张画布同时画多张图
2021/02/26 Python
HTML5是否真的可以取代Flash
2010/02/10 HTML / CSS
整理的15个非常有用的 HTML5 开发教程和速查手册
2011/10/18 HTML / CSS
请介绍一下Ant
2016/07/22 面试题
资金主管岗位职责范本
2014/03/04 职场文书
初中三好学生自我鉴定
2014/04/07 职场文书
个人综合鉴定材料
2014/05/23 职场文书
大学生工作自荐书
2014/06/16 职场文书
反四风个人对照检查材料思想汇报
2014/09/25 职场文书
业务员管理制度范本
2015/08/06 职场文书
担保公司2015年终工作总结
2015/10/14 职场文书
高一化学教学反思
2016/02/22 职场文书
Mysql外键约束的创建与删除的使用
2022/03/03 MySQL
Win11如何启用启动修复 ? Win11执行启动修复的三种方法
2022/04/08 数码科技
在NumPy中深拷贝和浅拷贝相关操作的定义和背后的原理
2022/04/14 Python
Spring中的@Transactional的工作原理
2022/06/05 Java/Android
Linux服务器离线安装 nginx的详细步骤
2022/06/16 Servers