Angular JS中的依赖注入

标签：

依赖注入DI

angularjs中与DI相关有angular.module()、angular.injector()、 $injector、$provide。

DI 容器3要素：服务的注册、依赖关系的声明、对象的获取。

angular依赖关系声明的三种方式

angular提供了3种获取依赖的方式：inference、annotation、inline方式。

其中annotation和inline方式，对于函数参数名称没有要求，是推荐的做法；inference方式强制要求参数名称和服务名称一致，如果JS代码经过压缩或者混淆，那么功能会出问题，不建议使用这种方式。

// 创建myModule模块、注册服务
var myModule = angular.module(‘myModule‘, []);
myModule.service(‘myService‘, function() {
     this.my = 0;
});

// 获取injector
var injector = angular.injector(["myModule"]);

// 第一种inference
injector.invoke(function(myService){alert(myService.my);});

// 第二种annotation
function explicit(serviceA) {alert(serviceA.my);};
explicit.$inject = [‘myService‘];
injector.invoke(explicit);

// 第三种inline
injector.invoke([‘myService‘, function(serviceA){alert(serviceA.my);}]);

如何理解module？

The angular.module() is a global place for creating, registering and retrieving Angular modules.When passed two or more arguments, a new module is created. If passed only one argument, an existing module (the name passed as the first argument to module) is retrieved。

该函数既可以创建新的模块，也可以获取已有模块，是创建还是获取，通过参数的个数来区分。

// 传递参数不止一个,代表新建模块;空数组代表该模块不依赖其他模块
var createModule = angular.module("myModule", []);

// 只有一个参数(模块名),代表获取模块
// 如果模块不存在,angular框架会抛异常
var getModule = angular.module("myModule");

// true,都是同一个模块
alert(createModule == getModule);

那么模块究竟是什么呢？

官方的Developer Guide上只有一句话：You can think of a module as a container for the different parts of your app – controllers, services, filters, directives, etc.

就是说模块是一些功能的集合，如控制器、服务、过滤器、指令等子元素组成的整体。

$provide和模块的关系

The $provide service has a number of methods for registering components with the $injector. Many of these functions are also exposed on angular.Module.

之前提到过：module和provide是用来注册服务到injector中的。查看官方的API，可以看到$provide提供了provide()、constant()、value()、factory()、service()来创建各种不同性质的服务；angular.Module中也提供了这5个服务注册方法。其实2者功能是完全一样的，就是用来向DI容器注册服务到injector中。

官方API下的auto有$provide 和 $injector，Implicit module which gets automatically added to each $injector.按照字面意思是说，每一个injector都有这2个隐含的服务。

angular.injector()

使用angular.injector();也能获取到注入器，但是没有和模块绑定。这种做法是没有意义的，相当于是你创建了一个空的DI容器，里面都没有服务别人怎么用呢。正确的做法是，在创建注入器的时候，指定需要加载的模块。

// 创建myModule模块、注册服务
var myModule = angular.module(‘myModule‘, []);
myModule.service(‘myService‘, function() {
            this.my = 0;
});

// 创建herModule模块、注册服务
var herModule = angular.module(‘herModule‘, []);
herModule.service(‘herService‘, function() {
            this.her = 1;
});

// 加载了2个模块中的服务
var injector = angular.injector(["myModule","herModule"]);
alert(injector.get("myService").my);
alert(injector.get("herService").her);

特别需要注意下：angular.injector()可以调用多次，每次都返回新建的injector对象。

var injector1 = angular.injector(["myModule","herModule"]);
var injector2 = angular.injector(["myModule","herModule"]);

alert(injector1 == injector2);//false

Angular JS中的依赖注入

标签：

原文地址：http://www.cnblogs.com/dorothychai/p/4739604.html