标签:
依赖注入(DI)的优点不再赘言,使用过spring框架的都知道。angularjs作为前台js框架。也提供了对DI的支持。这是javascript/jquery不具备的特性。
angularjs中与DI相关有angular.module()、angular.injector()、 $injector、$provide。对于一个DI容器来说,必须具备3个要素:服务的注冊、依赖关系的声明、对象的获取。比方spring中。服务的注冊是通过xml配置文件的<bean>标签或是注解@Repository、@Service、@Controller、@Component实现的;对象的获取能够ApplicationContext.getBean()实现;依赖关系的声明,即能够在xml文件里配置,也能够使用@Resource等注解在java代码中声明。在angular中,module和$provide相当于是服务的注冊;injector用来获取对象(angular会自己主动完毕依赖的注入)。依赖关系的声明在angular中有3种方式。以下从这3个方面,介绍下angular的DI。
1、angular.module()创建、获取、注冊angular中的模块
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);该函数既能够创建新的模块,也能够获取已有模块。是创建还是获取。通过參数的个数来区分。
angular.module(name, [requires], [configFn]);
name:字符串类型,代表模块的名称。
requires:字符串的数组,代表该模块依赖的其它模块列表。假设不依赖其它模块,用空数组就可以。
configFn:用来对该模块进行一些配置。
如今我们知道怎样创建、获取模块了,那么模块到底是什么呢?官方的Developer Guide上仅仅有一句话:You can think of a module as a container for the different parts of your app – controllers, services, filters, directives, etc.如今我还不太理解。大致就是说模块是一些功能的集合。如控制器、服务、过滤器、指令等子元素组成的总体。如今解释不了,先遗留。
2、$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个隐含的服务。但1.2.25版本号中,感觉没有办法获取injector中的$provide。不知道这是为什么?一般来说也不须要显示使用这个服务,直接使用module中提供的API就可以。
var injector = angular.injector(); alert(injector.has("$provide"));//false alert(injector.has("$injector"));//true
使用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);假设载入了多个模块,那么通过返回的injector能够获取到多个模块下的服务。这个样例中假设仅仅载入了myMoudle。那么得到的injector就不能訪问herMoudle下的服务。这里特别须要注意下:angular.injector()能够调用多次,每次都返回新建的injector对象。
var injector1 = angular.injector(["myModule","herModule"]); var injector2 = angular.injector(["myModule","herModule"]); alert(injector1 == injector2);//false
angular提供了3种获取依赖的方式:inference、annotation、inline方式。
// 创建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);}]);当中annotation和inline方式,对于函数參数名称没有要求,是推荐的做法;inference方式强制要求參数名称和服务名称一致。假设JS代码经过压缩或者混淆,那么功能会出问题,不建议使用这样的方式。
(七)理解angular中的module和injector,即依赖注入
标签:
原文地址:http://www.cnblogs.com/gcczhongduan/p/5373407.html