点击查看AngularJS系列目录
转载请注明出处:http://www.cnblogs.com/leosx/


依赖注入

依赖注入是软件设计模式中的一部分,用于处理组件是如何得到它说依赖的其它组件的。

Angular的注入器子系统(Angular是由多个系统组成)是负责创建组件,解决它们之间的依赖关系,并且根据它们的需要,给它们提供所需要的组件的实例。

使用依赖注入

依赖注入(DI)是贯通了整个angularjs的。当这个组件定义了,或者在module的run 方法config 方法中定义了它们,你就可以在这个module的任何地方使用这个组件了。

1、诸如:服务(service)、指令(directive)、过滤器(filter)和动画(animation)组件,都是通过注入器的工厂(factory)方法或者在构造函数中定义的。这些组件可以注入service"(服务) 或者 "value"(值)。

2、控制器(controller)就是使用构造函数的方式进行定义的。它可以注入service"(服务) 或者 "value"(值)。

3、run 方法接收一个function函数,它里面可以注入服务(service)或者值(value)亦或常量(constant),然后可以被注入到需要它们的组件当中去(注意,这里可以定义一些常量哦!)。提示:在run 中,你不能注入“provider”哦!

4、config 方法接收一个function函数,它可以注入"provider" and "constant"(常量)。提示:在config 方法中,你不可以注入"service"(服务) 或者 "value"(值)。

关于模块Modulesrun 方法和 config 方法的更多信息,请点击这里

工厂(factory)方法

使用factory来定义指令(directive),服务(service)或者过滤器(filter)。factory方法是注册在module(模块)下的。我们推荐你这样来定义factory:

angular.module('myModule', [])
.factory('serviceId', ['depService', function(depService) {
// ...
}])
.directive('directiveName', ['depService', function(depService) {
// ...
}])
.filter('filterName', ['depService', function(depService) {
// ...
}]);

模块儿(module)的方法

我们可以指定方法在configuration(配置环境)下运行,也可以在module(模块)的运行时,通过调用config 方法和 run 方法来运行。

angular.module('myModule', [])
.config(['depProvider', function(depProvider) {
// ...
}])
.run(['depService', function(depService) {
// ...
}]);

控制器

我们推荐如下的方式来注册一个Controller:

someModule.controller('MyController', ['$scope', 'dep1', 'dep2', function($scope, dep1, dep2) {
...
$scope.aMethod = function() {
...
}
...
}]);

不像服务一样,在应用程序中,相同的controller是可以有多个实例的哈。

依赖性的声明

在Angular中,调用一些方法都是使用注入的方式进行调用的,例如:service factory,controller。那么你就必须将它们所使用的组件给注入进去,以提供它们使用。有以下三种方式进行依赖关系的声明。

1、使用内联数组的声明方式

2、使用$inject 属性来声明

3、隐式声明方式(不推荐,并且会有警告)

一、内联数组的声明方式

这是非常好的一种声明依赖性的方式。来一个例子:

someModule.controller('MyController', ['$scope', 'greeter', function($scope, greeter) {
// ...
}]);

我们使用一个数组,这个数组由两部分元素组成,一个用于声明依赖性的字符串集合和最后一个元素(这个元素是一个方法,用于自己的实现)。

二、$inject 属性进行声明

直接上个例子:

var MyController = function($scope, greeter) {
// ...
}
MyController.$inject = ['$scope', 'greeter'];
someModule.controller('MyController', MyController);

需要注意的是,$inject 数组中的依赖,必须与MyController控制器中的参数一 一对应。

三、隐式声明

注意:如果你打算使用这种方式去运行代码,你的服务的名称可能会被重命名,服务也可能会在你的应用中被玩坏。

这是最简单的一种声明方式,你只要保证你的参数名称和依赖的组件名称能对得上。

someModule.controller('MyController', function($scope, greeter) {
// ...
});

在上面的例子当中,$scope 服务和 greeter 服务会被注入到controller里面去。这种方式的一个好处就是少了依赖性声明的数组的存在。而且可以很自由的重新排列你的依赖性。

但是,这个方法在混淆和压缩后是没有发用的。是无法正常工作的。因为这些动作都会重命名你的参数。呃呃呃……

ng-annotate 工具可以方便的让你在你的应用中使用这个隐式声明模式,因为它会在进行压缩或者混淆的时候自动把你的声明方式给改成我们推荐的内联方式进行声明,如果你想使用这种方式,可能你需要使用ng-strict-di(严格模式)。

正因为这种方式要使用严格模式,我们需要很小心,所以,一般我们都不会使用这种方式。

使用严格的依赖注入

你可以把ng-strict-di 指令增加到ng-app 指令所在的元素上,来使得你的应用使用的是严格模式。

<!doctype html>
<html ng-app="myApp" ng-strict-di>
<body>
I can add: {{ 1 + 2 }}.
<script src="angular.js"></script>
</body>
</html>

严格模式下,如果你尝试使用隐式方式来声明的时候,就会抛异常。

angular.module('myApp', [])
.factory('willBreak', function($rootScope) {
// $rootScope is implicitly injected
})
.run(['willBreak', function(willBreak) {
// Angular will throw when this runs(执行到这里会报错)
}]);

如果你是使用手动方式启动应用的话,你也可以这样来使用严格模式:

angular.bootstrap(document, ['myApp'], {
strictDi: true
});

AngularJS - 依赖注入(Dependency Injection)的更多相关文章

  1. 控制反转Inversion of Control (IoC) 与 依赖注入Dependency Injection (DI)

    控制反转和依赖注入 控制反转和依赖注入是两个密不可分的方法用来分离你应用程序中的依赖性.控制反转Inversion of Control (IoC) 意味着一个对象不会新创建一个对象并依赖着它来完成工 ...

  2. 简明依赖注入(Dependency Injection)

    前言 这是因特奈特上面不知道第几万篇讲依赖注入(Dependency Injection)的文章,但是说明白的却寥寥无几,这篇文章尝试控制字数同时不做大多数. 首先,依赖注入的是一件很简单的事情. 为 ...

  3. 14.AutoMapper 之依赖注入(Dependency Injection)

    https://www.jianshu.com/p/f66447282780   依赖注入(Dependency Injection) AutoMapper支持使用静态服务定位构建自定义值解析器和自定 ...

  4. 依赖注入 | Dependency Injection

    原文链接: Angular Dependency Injection翻译人员: 铁锚翻译时间: 2014年02月10日说明: 译者认为,本文中所有名词性的"依赖" 都可以理解为 & ...

  5. Spring点滴七:Spring中依赖注入(Dependency Injection:DI)

    Spring机制中主要有两种依赖注入:Constructor-based Dependency Injection(基于构造方法依赖注入) 和 Setter-based Dependency Inje ...

  6. 设计模式之————依赖注入(Dependency Injection)与控制反转(Inversion of Controller)

    参考链接: 依赖注入(DI) or 控制反转(IoC) laravel 学习笔记 —— 神奇的服务容器 PHP 依赖注入,从此不再考虑加载顺序 名词解释 IoC(Inversion of Contro ...

  7. 理解依赖注入(Dependency Injection)

    理解依赖注入 Yii2.0 使用了依赖注入的思想.正是使用这种模式,使得Yii2异常灵活和强大.千万不要以为这是很玄乎的东西,看完下面的两个例子就懂了. class SessionStorage { ...

  8. Spring之对象依赖关系(依赖注入Dependency Injection)

    承接上篇: Spring中,如何给对象的属性赋值: 1:通过构造函数,如下所示: <!-- 1:构造函数赋初始值 --><bean id="user1" clas ...

  9. MVC使用StructureMap实现依赖注入Dependency Injection

    使用StructureMap也可以实现在MVC中的依赖注入,为此,我们不仅要使用StructureMap注册各种接口及其实现,还需要自定义控制器工厂,借助StructureMap来生成controll ...

随机推荐

  1. Cognos 11.0快速开发指南 Ⅱ

    1.    创建报表 在创建好数据源之后,我们就可以创建报表了,报表的开发是浏览器中完成的,这里我选用了chrome浏览器,在地址栏输入:http://localhost:80/ibmcognos ( ...

  2. C# 三层架构之系统的登录验证与添加数据的实现

    利用三层架构体系,实现学生管理系统中用户的登录与添加班级信息的功能,一下代码为具体实现步骤的拆分过程: 一.用户登录界面功能的实现 1.在数据访问层(LoginDAL)进行对数据库中数据的访问操作 u ...

  3. salesforce零基础学习(八十)使用autoComplete 输入内容自动联想结果以及去重实现

    项目中,我们有时候会需要实现自动联想功能,比如我们想输入用户或者联系人名称,去联想出系统中有的相关的用户和联系人,当点击以后获取相关的邮箱或者其他信息等等.这种情况下可以使用jquery ui中的au ...

  4. vue.js移动端app实战4:上拉加载以及下拉刷新

    上拉加载以及下拉刷新都是移动端很常见的功能,在搜索或者一些分类列表页面常常会用到. 跟横向滚动一样,我们还是采用better-scroll这个库来实现.由于better已经更新了新的版本,之前是0.几 ...

  5. Singleton(单例)模式

    Singleton(单例)模式:保证一个类仅有一个实例,并提供一个访问它的全局访问点. public class Singleton { private static Singleton ourIns ...

  6. 01-TypeScript概述

    本篇文章向大家介绍新的TypeScript客户端脚本语言,主要涉及两个方面,一是传统JavaScript语言的弱点,二是TypeScript语言的优势. 一.JavaScript的弱点 1.弱类型,缺 ...

  7. python-分页代码

    page.py ''' django内使用方式: all_count = models.UserInfo.objects.all().count() # path_info 当前页的url # all ...

  8. 团队作业8----第二次项目冲刺(beta阶段)5.20

    Day2--5.20 1.每日讨论 会议内容:1.新成员乔桦和周迪慢慢了解项目. 2.组内负责主要编程的益靖对代码进行了大概的说明. 3.对昨天的工作进行了几点总结. 4.组长对每个成员的任务完成了分 ...

  9. 201521123013 《Java程序设计》第4周学习总结

    1. 本章学习总结 1.1 尝试使用思维导图总结有关继承的知识点. 1.2 使用常规方法总结其他上课内容. 1.多态是面向对象的三大特性之一.多态的意思:相同的形态,可以实不同的行为.Java中实现多 ...

  10. 201521123087 《Java程序设计》第1周学习总结

    1.学习总结 初步了解面对对象编程思想 学会安装JDK和设置JAVA_HOME,PATH,CLASSPATH环境变量 简单了解java 2.书面作业 1.为什么java程序可以跨平台运行?执行java ...