理解angular中的module和injector,即依赖注入

依赖注入(DI)的好处不再赘言,使用过spring框架的都知道。angularjs作为前台js框架,也提供了对DI的支持,这是javascript和jquery不具备的特性。angularjs中与DI相关有angular.module()、angular.injector()和服务$injector、$provide。对于一个DI容器来说,必须具备3个要素:服务的注册、依赖关系的声明、对象的获取。

在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。

//: angular.module(name, [requires], [configFn])
// 传递参数不止一个,代表新建模块; 空数组代表该模块不依赖其他模块
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

3、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);

如果加载了多个模块,那么通过返回的injector可以获取到多个模块下的服务。这个例子中如果只加载了myMoudle,那么得到的injector就不能访问herMoudle下的服务。这里特别需要注意下:angular.injector()可以调用多次,每次都返回新建的injector对象。

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

4、angular中三种声明依赖的方式

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,即依赖注入的更多相关文章

  1. (七)理解angular中的module和injector,即依赖注入

    (七)理解angular中的module和injector,即依赖注入 时间:2014-10-10 01:16:54      阅读:63060      评论:1      收藏:0      [点 ...

  2. 6.在MVC中使用泛型仓储模式和依赖注入实现增删查改

    原文链接:http://www.c-sharpcorner.com/UploadFile/3d39b4/crud-operations-using-the-generic-repository-pat ...

  3. MVC中使用泛型仓储模式和依赖注入

    在ASP.NET MVC中使用泛型仓储模式和依赖注入,实现增删查改 原文链接:http://www.codeproject.com/Articles/838097/CRUD-Operations-Us ...

  4. 在MVC中使用泛型仓储模式和依赖注入实现增删查改

    标签: 原文链接:http://www.c-sharpcorner.com/UploadFile/3d39b4/crud-operations-using-the-generic-repository ...

  5. ASP.NET Core中使用GraphQL - 第三章 依赖注入

    ASP.NET Core中使用GraphQL ASP.NET Core中使用GraphQL - 第一章 Hello World ASP.NET Core中使用GraphQL - 第二章 中间件 SOL ...

  6. spring中的控制反转IoC和依赖注入DI

    原文:http://blog.163.com/xianghuxian@126/blog/static/50639037200721345218382/ IoC(Inversion of Control ...

  7. 理解Angular中的$apply()以及$digest()

    $apply()和$digest()在AngularJS中是两个核心概念,但是有时候它们又让人困惑.而为了了解AngularJS的工作方式,首先需要了解$apply()和$digest()是如何工作的 ...

  8. 深入理解Angular中的$Apply()以及$Digest()

    $apply()和$digest()在AngularJS中是两个核心概念,但是有时候它们又让人困惑.而为了了解AngularJS的工作方式,首先需要了解$apply()和$digest()是如何工作的 ...

  9. (网页)理解Angular中的$apply()以及$digest()

    转自CSDN: 工作有问题上CSDN上转转. $apply()和$digest()在AngularJS中是两个核心概念,但是有时候它们又让人困惑.而为了了解AngularJS的工作方式,首先需要了解$ ...

随机推荐

  1. JAVA设计原则

      1.单一职责规则(SRP):有且仅有一个原因引起类的变化. 2.依赖倒置规则(DIP): 高层模块不应该依赖底层模块,两者都用依赖接口: 接口不依赖细节: 细节依赖接口. 3.接口隔离规则:类间的 ...

  2. 不要伤害指针(1)--运算符&和*

    原文转载地址:http://blog.csdn.net/sunchaoenter/article/details/6646001 增加自己的想法,作为笔记. 这里&是取地址运算符,*是间接运算 ...

  3. QF——iOS沙盒机制

    iOS沙盒机制: 什么是沙盒机制?  点击进入  点击进入 沙盒机制(SandBox)是一种安全体系,它规定了APP的所有文件数据都必须存储在这片区域.所有非代码文件的数据都保存在这片区域. 沙盒里有 ...

  4. Properties读写资源文件

    Java中读写资源文件最重要的类是Properties,功能大致如下: 1. 读写Properties文件 2. 读写XML文件 3. 不仅可以读写上述两类文件,还可以读写其它格式文件如txt等,只要 ...

  5. Swift 基本基本运算符

    Swift 1,赋值运算符 Swift赋值表达式是没有值的,不支持连续赋值. 2,算术运算符 除数可为0 var f=1/0.0 求余的结果的正负取决于被除数 3,溢出运算符* 根据二进制来进行计算 ...

  6. Docker镜像与仓库(二)Dockerfile

    Docker镜像文件与仓库(二) Docker镜像文件与仓库(二) Dockerfile指令 Dockerfile格式: 1.#Comment注释2.INSTRUCTION大写的指令名 argumen ...

  7. Couldn't read row 0, col -1 from CursorWindow

    java.lang.IllegalStateException: Couldn't read row 0, col -1 from CursorWindow.  Make sure the Curso ...

  8. LINUX查看硬件配置命令

    LINUX查看硬件配置命令   系统 # uname -a # 查看内核/操作系统/CPU信息 # head -n 1 /etc/issue # 查看操作系统版本 # cat /proc/cpuinf ...

  9. Oracle EBS-SQL (SYS-12):查询各Profile的设置情况.sql

    SELECT pro.profile_option_name, pro.user_profile_option_name, lev.level_type TYPE, --lev.level_code, ...

  10. 製程能力介紹(SPC introduction) ─ Cpk之製程能力解釋

    Cpk之製程能力解釋 Cpk就是綜合考慮精度與準度的製程能力指標. Cpk=(1-Ck)‧Cp 也就是在考慮Cp的同時,再考慮乘上一個(1-Ck)係數,去彌補Cp之不足,此係數最大時為1,也就是(Ck ...