angular依賴注入

http://www.cooklife.cn/detail/54c33ea2c93620284e964b56#View


使用過java進行開發的人肯定知道大名鼎鼎的spring框架,對於spring的IOC肯定也有所瞭解,通過配置文件定義好bean之後,如果需要使用這些bean,不需要自己去實例化,而是跟spring這個大容器去要就行了。我們的angular框架也實現了這種機制。

思考一下,如果對象需要獲得其對依賴的控制權,有哪幾種方式?

1.在對象內部自行創建依賴的實例

2.將依賴定義爲全局的,然後通過全局變量去引用

3.在需要的地方通過參數去傳遞

依賴注入就是通過第三種方式去實現的,通過依賴注入可以出去對依賴關係的硬編碼。

我們先來看看一個實例,angular中如何使用依賴注入。


angular.module('test',[]).controller('TestController', function($scope, $location){

})
我們給模塊註冊一個控制器,控制器接受兩個參數$scope以及$location,這兩個參數是angular內置的服務,那麼控制器被調用的時候這些服務是如何由誰注入進去的呢?


在angular通過$injector服務來管理依賴關係的查詢和實例化。

推斷式注入聲明

在上面的例子中,沒有任何聲明,angularjs認爲參數的名稱就是依賴的名稱,angular根據參數的名稱在已註冊的服務中進行查找,然後通過$injector將這些參數注入進實例對象

injector.invoke(function($scope, $location){})

因爲此處是根據參數的名稱進行注入的,因此參數的順序沒有關係。

但是在生產環境中,爲了縮短網頁的加載的時間,我們通常會將js文件進行壓縮,參數的名字會被別名替代,這個時候根據參數名稱就行注入就行不通了。

顯示注入聲明

通過顯示的方法來明確定義函數的依賴關係,即使源代碼被壓縮了,也能夠正常運行。通過$inject屬性來顯示的進行注入。函數對象的$inject屬性是一個數組,其元素是字符串,其值爲需要注入的服務名稱。


angular.module('test',[]).controller('TestController', TestController);

function TestController($scope, $location){

}
TestController.$injector = ['$scope','$location']

行內注入聲明


行內的注入聲明其實和顯示注入聲明效果一樣,只是在函數定義的時候從行內將參數傳入,可以避免在使用過程中使用臨時變量。


angular.module('test',[]).controller('TestController', ['$scope', '$location',function($scope, $location){

}])

發佈了81 篇原創文章 · 獲贊 12 · 訪問量 53萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章