一、什么是Module？
很多應(yīng)用都有一個(gè)用于初始化、加載（wires是這個(gè)意思嗎？）和啟動(dòng)應(yīng)用的main方法。angular應(yīng)用不需要main方法，作為替代，module提供有指定目的的聲明式，描述應(yīng)用如何啟動(dòng)。這樣做有幾項(xiàng)優(yōu)點(diǎn)：
二、The Basics（基礎(chǔ)）
我們很迫切想知道如何讓Hello World module能夠工作。下面有幾個(gè)關(guān)鍵的事情要注意：
<!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 class="ng-cloak"> {{'Kitty' | greet}}</div><script src="../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）推薦設(shè)置
雖然上面的例子很簡單，它不屬于大規(guī)模的應(yīng)用。我們建議將自己的應(yīng)用按照如下建議，拆分為多個(gè)module：
這樣劃分的理由是，當(dāng)我們?cè)跍y(cè)試的時(shí)候，往往需要忽略那些讓測(cè)試變得困難的初始化代碼。通過將代碼分成獨(dú)立的module，在測(cè)試中就可以很容易地忽略那些代碼。這樣，我們就可以更加專注在加載相應(yīng)的module進(jìn)行測(cè)試。
上面的只是一個(gè)建議，可以隨意地按照自己的需求制定。
四、Module Loading & Dependencies（模塊加載和依賴）
module是配置（configuration）的集合，執(zhí)行在啟動(dòng)應(yīng)用的進(jìn)程中應(yīng)用的塊（blocks）。在它的最簡單的形式中，由兩類block組成：
1.配置塊（configuration blocks）：在provider注冊(cè)和配置的過程中執(zhí)行的。只有provider和constant（常量？）可以被注入（injected）到configuration blocks中。這是為了避免出現(xiàn)在service配置完畢之前service就被執(zhí)行的意外。
2.運(yùn)行塊（run blocks）：在injector創(chuàng)建完成后執(zhí)行，用于啟動(dòng)應(yīng)用。只有實(shí)例（instances）和常量（constants）可以被注入到run block中。這是為了避免進(jìn)一步的系統(tǒng)配置在程序運(yùn)行的過程中執(zhí)行。
angular.module('myModule', []). config(function(injectables) { // provider-injector // 這里是config block的一個(gè)例子 // 我們可以根據(jù)需要，弄N個(gè)這樣的東東 // 我們可以在這里注入Providers (不是實(shí)例，not instances)到config block里面 }). run(function(injectables) { // instance-injector // 這里是一個(gè)run block的例子 // 我們可以根據(jù)需要，弄N個(gè)這樣的東東 // 我們只能注入實(shí)例（instances ）（不是Providers）到run block里面});
a) Configuration Blocks（配置塊）
有一個(gè)方便的方法在module中，它相當(dāng)于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被應(yīng)用的順序，與它們的注冊(cè)的順序一致。對(duì)于常量定義來說，是一種額外的情況，即放置在configuration blocks開頭的常量定義。
b) Run Blocks（應(yīng)用塊）
run block是在angular中最接近main方法的東東。run block是必須執(zhí)行，用于啟動(dòng)應(yīng)用的代碼。它將會(huì)在所有service配置、injector創(chuàng)建完畢后執(zhí)行。run block通常包含那些比較難以進(jìn)行單元測(cè)試的代碼，就是因?yàn)檫@個(gè)原因，這些代碼應(yīng)該定義在一個(gè)獨(dú)立的module中，讓這些代碼可以在單元測(cè)試中被忽略。
c) Dependencies（依賴）
一個(gè)module可以列出它所依賴的其他module。依賴一個(gè)module，意味著被請(qǐng)求（required）的module（被依賴的）必須在進(jìn)行請(qǐng)求（requiring）module（需要依賴其他module的module，請(qǐng)求方）加載之前加載完成。換一種說法，被請(qǐng)求的module的configuration block會(huì)在請(qǐng)求的module的configuration block執(zhí)行前執(zhí)行（before the configuration blocks or the requiring module，這里的or怎么解釋呢？）。對(duì)于run block也是這個(gè)道理。每一個(gè)module只能夠被加載一次，即使有多個(gè)其他module需要（require）它。
d) Asynchronous Loading（異步加載）
module是管理$injector配置的方法之一，不用對(duì)加載腳本到VM做任何事情?，F(xiàn)在已經(jīng)有現(xiàn)成的項(xiàng)目專門用于處理腳本加載，也可以用到angular中。因?yàn)?/span>module在加載的過程中不做任何事情，它們可以按照任意的順序被加載到VM中。腳本加載器可以利用這個(gè)特性，進(jìn)行并行加載。
五、Unit Testing（單元測(cè)試）
在單元測(cè)試的最簡單的形式中，其中一個(gè)是在測(cè)試中實(shí)例化一個(gè)應(yīng)用的子集，然后運(yùn)行它們。重要的是，我們需要意識(shí)到對(duì)于每一個(gè)injector，每一個(gè)module只會(huì)被加載一次。通常一個(gè)應(yīng)用只會(huì)有一個(gè)injector。但在測(cè)試中，每一個(gè)測(cè)試用例都有它的injector，這意味著在每一個(gè)VM中，module會(huì)被多次加載。正確地構(gòu)建module，將對(duì)單元測(cè)試有幫助，正如下面的例子：
在這個(gè)例子中，我們準(zhǔn)備假設(shè)定義如下的module：
angular.module('greetMod', []).factory('alert', function($window) { return function(text) { $window.alert(text); };}).value('salutation', 'Hello').factory('greet', function(alert, salutation) { return function(name) { alert(salutation + ' ' + name + '!'); };});讓我們寫一些測(cè)試用例：
describe('myApp', function() { // 加載應(yīng)用響應(yīng)的module，然后加載指定的將$window重寫為mock版本的測(cè)試module， // 這樣做，當(dāng)進(jìn)行window.alert()時(shí)，測(cè)試器就不會(huì)因被真正的alert窗口阻擋而停止 //這里是一個(gè)在測(cè)試中覆蓋配置信息的例子 beforeEach(module('greetMod', function($provide) {//這里看來是要將真正的$window替換為以下的東東 $provide.value('$window', { alert: jasmine.createSpy('alert') }); })); // inject()會(huì)創(chuàng)建一個(gè)injector，并且注入greet和$window到測(cè)試中。 // 測(cè)試不需要關(guān)心如何寫應(yīng)用，只需要關(guān)注如何測(cè)試應(yīng)用。 it('should alert on $window', inject(function(greet, $window) { greet('World'); expect($window.alert).toHaveBeenCalledWith('Hello World!'); })); // 這里是在測(cè)試中通過行內(nèi)module和inject方法來覆蓋配置的方法 it('should alert using the alert service', function() { var alertSpy = jasmine.createSpy('alert'); module(function($provide) { $provide.value('alert', alertSpy); }); inject(function(greet) { greet('World'); expect(alertSpy).toHaveBeenCalledWith('Hello World!'); }); });});
聯(lián)系客服
