最近在看AngularJS權威指南，由于各種各樣的原因（主要是因為我沒有money，好討厭的有木有......），于是我選擇了網上下載電子版的（因為它不要錢，哈哈...），字體也蠻清晰的，總體效果還不錯。但是，當我看到左上角的總頁碼的時候，479頁....479....479....俺的小心臟被擊穿了二分之一有木有啊，上半身都石化了有木有啊，那種特別想學但是看到頁碼又不想學的糾結的心情比和女朋友吵架了還復雜有木有啊，我平?？吹碾娮訒傥粩刀疾淮笥?的好伐！ 哎，原諒我吧，我應該多看幾本新華字典習慣習慣的...

不過幸好在看電子書之前，我已經稍微有點基礎了，之前看著視頻學習了一些，從雙向數據綁定到服務，然后到指令系統，都多多少少有些接觸。并且在一次web專選課結課作業當中，通過前端的AngularJS和后臺的NodeJS加Mongoose搭建了一個簡易學生班級管理系統。因為沒有錢，所以只能放在GitHub了，GitHub地址: 學生管理系統，歡迎來fork哈，下面進入正題...

=======================================請叫我華麗的分割線=======================================

一個對象通常有三種方式可以獲得對其依賴的控制權：

  (1) 在內部創建依賴；
  (2) 通過全局變量進行引用；
  (3) 在需要的地方通過參數進行傳遞。

依賴注入是通過第三種方式實現的。其余兩種方式會帶來各種問題，例如污染全局作用域，使隔離變得異常困難等。依賴注入是一種設計模式，它可以去除對依賴關系的硬編碼，從而可以在運行時改變甚至移除依賴關系。

  在運行時修改依賴關系的能力對測試來講是非常理想的，因為它允許我們創建一個隔離的環境，從而在測試環境可以使用模擬的對象取代生產環境中的真實對象。

 從功能上看，依賴注入會事先自動查找依賴關系，并將注入目標告知被依賴的資源，這樣就可以在目標需要時立即將資源注入進去。

 在編寫依賴于其他對象或庫的組件時，我們需要描述組件之間的依賴關系。在運行期，注入器會創建依賴的實例，并負責將它傳遞給依賴的消費者。

// 出自Angular文檔的優秀示例function SomeClass(greeter) {this.greeter = greeter;}SomeClass.prototype.greetName = function(name) {this.greeter.greet(name);};//注意，示例代碼在全局作用域上創建了一個控制器，這并不是一個好主意，這里只是為了方便演示。

SomeClass 能夠在運行時訪問到內部的 greeter ，但它并不關心如何獲得對 greeter 的引用。為了獲得對 greeter 實例的引用， SomeClass 的創建者會負責構造其依賴關系并傳遞進去。

基于以上原因，AngularJS使用 $injetor （注入器服務）來管理依賴關系的查詢和實例化。事實上， $injetor 負責實例化AngularJS中所有的組件，包括應用的模塊、指令和控制器等。

在運行時，任何模塊啟動時 $injetor 都會負責實例化，并將其需要的所有依賴傳遞進去。

例如下面這段代碼。這是一個簡單的應用，聲明了一個模塊和一個控制器：

angular.module('myApp', []).factory('greeter', function() {return {greet: function(msg) {alert(msg);}}}).controller('MyController',function($scope, greeter) {$scope.sayHello = function() {greeter.greet("Hello!");};});

當AngularJS實例化這個模塊時，會查找 greeter 并自然而然地把對它的引用傳遞進去：

<div ng-app="myApp"><div ng-controller="MyController"><button ng-click="sayHello()">Hello</button></div></div>

而在內部，AngularJS的處理過程是下面這樣的：

// 使用注入器加載應用var injector = angular.injector(['ng', 'myApp']);// 通過注入器加載$controller服務var $controller = injector.get('$controller');// 加載控制器并傳入一個作用域，同AngularJS在運行時做的一樣var scope = injector.get('$rootScope').$new();var MyController = $controller('MyController', {$scope: scope});

上面的代碼中并沒有說明是如何找到 greeter 的，但是它的確能正常工作，因為 $injector會負責為我們查找并加載它。

AngularJS通過 annotate 函數，在實例化時從傳入的函數中把參數列表提取出來。在Chrome的開發者工具中輸入下面的代碼可以查看這個函數：

> injector.annotate(function($q, greeter) {}) ["$q", "greeter"]

在任何一個AngularJS的應用中，都有 $injector 在進行工作，無論我們知道與否。當編寫控制器時，如果沒有使用 [] 標記或進行顯式的聲明， $injector 就會嘗試通過參數名推斷依賴關系。

推斷式注入聲明 

如果沒有明確的聲明，AngularJS會假定參數名稱就是依賴的名稱。因此，它會在內部調用函數對象的 toString() 方法，分析并提取出函數參數列表，然后通過 $injector 將這些參數注入進對象實例。注入的過程如下：

injector.invoke(function($http, greeter) {});

請注意，這個過程只適用于未經過壓縮和混淆的代碼，因為AngularJS需要原始未經壓縮的參數列表來進行解析。有了這個根據參數名稱進行推斷的過程，參數順序就沒有什么重要的意義了，因為AngularJS會幫助我們把屬性以正確的順序注入進去。

顯式注入聲明

AngularJS提供了顯式的方法來明確定義一個函數在被調用時需要用到的依賴關系。通過這種方法聲明依賴，即使在源代碼被壓縮、參數名稱發生改變的情況下依然能夠正常工作?？梢酝ㄟ^$inject 屬性來實現顯式注入聲明的功能。函數對象的 $inject 屬性是一個數組，數組元素的類型是字符串，它們的值就是需要被注入的服務的名稱。

下面是示例代碼：

var aControllerFactory =function aController($scope, greeter) {console.log("LOADED controller", greeter);// ……控制器};aControllerFactory.$inject = ['$scope', 'greeter']; // Greeter服務console.log("greeter service");}// 我們應用的控制器angular.module('myApp', []).controller('MyController', aControllerFactory).factory('greeter', greeterService);// 獲取注入器并創建一個新的作用域var injector = angular.injector(['ng', 'myApp']),controller = injector.get('$controller'),rootScope = injector.get('$rootScope'),newScope = rootScope.$new();// 調用控制器controller('MyController', {$scope: newScope});

對于這種聲明方式來講，參數順序是非常重要的，因為 $inject 數組元素的順序必須和注入參數的順序一一對應。這種聲明方式可以在壓縮后的代碼中運行，因為聲明的相關信息已經和函數本身綁定在一起了。

行內注入聲明

AngularJS提供的注入聲明的最后一種方式，是可以隨時使用的行內注入聲明。這種方式其實是一個語法糖，它同前面提到的通過 $inject 屬性進行注入聲明的原理是完全一樣的，但允許我們在函數定義時從行內將參數傳入。此外，它可以避免在定義過程中使用臨時變量。

在定義一個AngularJS的對象時，行內聲明的方式允許我們直接傳入一個參數數組而不是一個函數。數組的元素是字符串，它們代表的是可以被注入到對象中的依賴的名字，最后一個參數就是依賴注入的目標函數對象本身。

示例如下：

angular.module('myApp').controller('MyController', ['$scope', 'greeter', function($scope, greeter) {}]);

由于需要處理的是一個字符串組成的列表，行內注入聲明也可以在壓縮后的代碼中正常運行。通常通過括號和聲明數組的 [] 符號來使用它。

以上這篇AngularJS 依賴注入就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持武林網。