一、什么是Module?
很多应用都有一个用于初始化、加载(wires是这个意思吗?)和启动应用的main方法。angular应用不需要main方法,作为替代,module提供有指定目的的声明式,描述应用如何启动。这样做有几项优点:
这过程是声明描述的,更加容易读懂。
在单元测试中,不需要加载所有module,这对写单元测试很有帮助。
额外的module可以被加载到情景测试中,可以覆盖一些设置,帮助进行应用的端对端测试(end-to-end test)。
第三方代码可以作为可复用的module打包到angular中。
module可以通过任意顺序或并行加载(取决于模块执行的延迟性,due to delayed nature of module execution)。
二、The Basics(基础)
我们很迫切想知道如何让Hello World module能够工作。下面有几个关键的事情要注意:
module API()
注意的提及的在<html ng-app=”myApp”>中的myApp module,它让启动器启动我们定义的myApp module。
<!DOCTYPE HTML>
<html lang="zh-cn" ng-app="myApp">
<head>
<meta charset="UTF-8">
<title>basics</title>
<style type="text/css">
.ng-cloak {
display: none;
}
</style>
</head>
<body>
<div>
{{'Kitty' | greet}}
</div>
<script src="https://www.jb51.net/angular-1.0.1.js" type="text/javascript"></script>
<script type="text/javascript">
var simpleModule = angular.module("myApp", []);
simpleModule.filter("greet", function () {
return function(name) {
return "Hello " + name + " !";
}
});
</script>
</body>
</html>
三、(Recommended Setup)推荐设置
虽然上面的例子很简单,它不属于大规模的应用。我们建议将自己的应用按照如下建议,拆分为多个module:
service module,用于声明service。
directive module,用于声明directive。
filter module,用于声明filter。
应用级别的module,依赖上述的module,并且包含初始化的代码。
这样划分的理由是,当我们在测试的时候,往往需要忽略那些让测试变得困难的初始化代码。通过将代码分成独立的module,在测试中就可以很容易地忽略那些代码。这样,我们就可以更加专注在加载相应的module进行测试。
上面的只是一个建议,可以随意地按照自己的需求制定。
四、Module Loading & Dependencies(模块加载和依赖)
module是配置(configuration)的集合,执行在启动应用的进程中应用的块(blocks)。在它的最简单的形式中,由两类block组成:
1.配置块(configuration blocks):在provider注册和配置的过程中执行的。只有provider和constant(常量?)可以被注入(injected)到configuration blocks中。这是为了避免出现在service配置完毕之前service就被执行的意外。
2.运行块(run blocks):在injector创建完成后执行,用于启动应用。只有实例(instances)和常量(constants)可以被注入到run block中。这是为了避免进一步的系统配置在程序运行的过程中执行。
angular.module('myModule', []). config(function(injectables) { // provider-injector // 这里是config block的一个例子 // 我们可以根据需要,弄N个这样的东东 // 我们可以在这里注入Providers (不是实例,not instances)到config block里面 }). run(function(injectables) { // instance-injector // 这里是一个run block的例子 // 我们可以根据需要,弄N个这样的东东 // 我们只能注入实例(instances )(不是Providers)到run block里面 });
a) Configuration Blocks(配置块)
有一个方便的方法在module中,它相当于config block。例如:
angular.module('myModule', []). value('a', 123). factory('a', function() { return 123; }). directive('directiveName', ...). filter('filterName', ...); // 等同于 angular.module('myModule', []). config(function($provide, $compileProvider, $filterProvider) { $provide.value('a', 123) $provide.factory('a', function() { return 123; }) $compileProvider.directive('directiveName', ...). $filterProvider.register('filterName', ...); });
configuration blocks被应用的顺序,与它们的注册的顺序一致。对于常量定义来说,是一种额外的情况,即放置在configuration blocks开头的常量定义。
b) Run Blocks(应用块)
run block是在angular中最接近main方法的东东。run block是必须执行,用于启动应用的代码。它将会在所有service配置、injector创建完毕后执行。run block通常包含那些比较难以进行单元测试的代码,就是因为这个原因,这些代码应该定义在一个独立的module中,让这些代码可以在单元测试中被忽略。
c) Dependencies(依赖)