1.模塊和依賴注入概述
1.了解模塊
AngularJS模塊是一種容器，把代碼隔離並組織成簡潔，整齊，可復用的塊。
模塊本身不提供直接的功能：包含其他提供功能的對象的實例：控制器，過濾器，服務，動畫
可通過定義其提供的對象構建模塊。通過依賴注入將模塊連接在一起，構建一個完整的應用程序。
AngularJS建立在模塊原理上。大部分AngularJS提供的功能都內置到ng-*模塊中。
2.依賴注入
定義依賴對象並動態地把它注入另一個對象，使得所有的依賴對象所提供的功能都能使用。（提供器 注入器服務）
提供器：如何創建一個具有所有必要功能的對象的實例（模塊的一部分），一個模塊把提供器注冊到注入器的服務器中。（一個提供器對象只創建一個實例）
注入器服務：跟蹤提供器對象的實例。（提供器模塊-注入器服務實例）
2.定義AngularJS模塊
AngularJS模塊實現：配置階段，運行階段
1.創建AngularJS Module對象
創建Module對象，注冊到注入器服務，返回新創建的Module實例（實現提供器的功能）
var myapp=angular.module(name,[requires],[configFn]);
name:注冊在注入器服務中的名稱
requires:被添加到注入器服務的供這個模塊使用的模塊名的數組，若需要另一個模塊的功能，需要添加在requires列表（ng模塊會默認添加）
configFn:模塊配置階段調用的另一個函數
var myModule=angular.module('myModule',['$Window','$http'],function(){
$provide.value('myValue','Some Value');
})
如果沒有requires（依賴），不會創建Module對象，是返回已經創建的實例（會覆蓋上面實例的定義）
var myModule2=angular.module('myModule',[]);
返回上面的實例，沒有列出依賴
var myModule3=angular.module('myModule');
2.使用配置塊
被定義后，執行模塊配置。任何提供器都被注冊到依賴注入器。
injectable:提供器服務函數，如$provide
config(funciton([injectable,...]))
$provide和$filterProvider服務被傳送到config函數。（把命名為startTime的 值提供器 和 命名為myFilter的 過濾器提供器 注冊到 注入器服務）
var myModule=angular.module('myModule',[])
myModule.config(function($provide,$filterProvider){
$provide.value("startTime",new Date());
$filterProvider.register('myFilter',function(){});
})
3.使用運行塊
配置完成，可以執行AngularJS模塊的運行階段。
運行塊中不能實現任何提供器代碼。（整個模塊已經配置完成 注冊到 依賴注入器了）
run(function([injectable,...]))
injectable只是注入器實例。
myModule.run(function(startTime){
startTime.setTime((new Date()).getTime());
})
專門的AngularJS對象提供器（除了config() (有相應的 animation controller filter directive 對象定義)）
- animation(name,animationFactory)
- controller(name,controlFactory)
- filter(name,filterFactory)
- directive(name,directiveFactory)
基本控制器：AngularJS具有 內置控制器對象 並知道所有控制器對象 都必須接受 一個作用域對象 作為第一個參數
var mod=angular.module('myMod',[]);
mod.controller('nyController',function($scope){
$scope.somevalue='somevalue';
})
服務提供器
是一類獨特的提供器（不存在已有的特定格式），作為一個服務來提供功能。
- value(name,object):最基礎的，object參數被簡單分配到name,所以注入器中name值和object之間有直接關系
- constant(name,object):與value類似，但value不可更改。
- factory(name,factoryFunction):采用factoryFunction參數構建將通過注入器提供的對象
- service(name,serviceFactory):添加了更面向對象的方法
- provider(name,providerFactory):所有其他方法的核心
基本例子：(定義constant value 提供器，方法中定義的值 被注冊在 myMod模塊 的 注入器服務器 中，通過名字訪問)
var mod=angular.module('myMod',[]);
mod.constant("ID","ABC");
mod.value('couter',0);
mod.value('image',{name:'box.jpg',height:12,width:20});
4.實現依賴注入
一旦定義模塊和相應的提供器。就可以把該模塊作為其他模塊，控制器，其他各種AngularJS對象的依賴來添加（依賴於提供器的對象的$jnject屬性值）
var myController=function($scope,appMsg){
$scope.message=appMsg;
};
controller['$inject']=['$scope','appMsg'];
myApp.myController('controllerA',controller);
//第二種表達
myApp.control('controllerA',['$scope','appMsg',function($scope,appMsg){
$scope.message=appMsg;
}])
injector.js:在控制器和模塊定義中實現依賴注入
<!DOCTYPE html>
<html lang="en" ng-app="myApp">
<head>
<meta charset="UTF-8">
<title>AngularJS Dependency Injection</title>
</head>
<body>
<div ng-controller="controllerA">
<h2>Application Message:</h2>
{{message}}
</div>
<hr>
<div ng-controller="controllerB">
<h2>Module Message:</h2>
{{message}}
</div>
<script type="text/javascript" src="angular-1.3.0.js"></script>
<script type="text/javascript" src="injector.js"></script>
</body>
</html>
var myMod=angular.module('myMod',[]);
myMod.value('modMsg','Helllo from my Module');
myMod.controller('controllerB', ['$scope','modMsg',function($scope,msg){
$scope.message=msg;
}]);
var myApp=angular.module('myApp', ['myMod']);
myApp.value('appMsg','Hello from myApp');
myApp.controller('controllerA', ['$scope','appMsg',function($scope,msg){
$scope.message=msg;
}]);