詳解Angularjs中的依賴注入
一個(gè)對(duì)象通常有三種方式可以獲得對(duì)其依賴的控制權(quán)：
- 在內(nèi)部創(chuàng)建依賴；
- 通過全局變量進(jìn)行引用；
- 在需要的地方通過參數(shù)進(jìn)行傳遞
依賴注入是通過第三種方式實(shí)現(xiàn)的。比如：
function SomeClass(greeter) {
this.greeter = greeter;
}
SomeClass.prototype.greetName = function(name) {
this.greeter.greet(name);
};
SomeClass能夠在運(yùn)行時(shí)訪問到內(nèi)部的greeter，但它并不關(guān)心如何獲得對(duì)greeter的引用。
為了獲得對(duì)greeter實(shí)例的引用，SomeClass的創(chuàng)建者會(huì)負(fù)責(zé)構(gòu)造其依賴關(guān)系并傳遞進(jìn)去。
基于以上原因，AngularJS使用$injetor（注入器服務(wù)）來管理依賴關(guān)系的查詢和實(shí)例化。
事實(shí)上，$injetor負(fù)責(zé)實(shí)例化AngularJS中所有的組件，包括應(yīng)用的模塊、指令和控制器等。
例如下面這段代碼。這是一個(gè)簡單的應(yīng)用，聲明了一個(gè)模塊和一個(gè)控制器：
angular.module('myApp', [])
.factory('greeter', function() {
return {
greet: function(msg) {alert(msg);}
}
})
.controller('MyController',
function($scope, greeter) {
$scope.sayHello = function() {
greeter.greet("Hello!");
};
});
當(dāng)AngularJS實(shí)例化這個(gè)模塊時(shí)，會(huì)查找greeter并自然而然地把對(duì)它的引用傳遞進(jìn)去：
<div ng-app="myApp"> <div ng-controller="MyController"> <button ng-click="sayHello()">Hello</button> </div> </div>
而在內(nèi)部，AngularJS的處理過程是下面這樣的：
// 使用注入器加載應(yīng)用
var injector = angular.injector(['ng', 'myApp']);
// 通過注入器加載$controller服務(wù)：var $controller = injector.get('$controller');
var scope = injector.get('$rootScope').$new();
// 加載控制器并傳入一個(gè)作用域，同AngularJS在運(yùn)行時(shí)做的一樣
var MyController = $controller('MyController', {$scope: scope})
以上就是本文的全部內(nèi)容，希望本文對(duì)大家學(xué)習(xí)Angularjs依賴注入有所幫助。
相關(guān)文章
這篇文章主要介紹了AngularJS 單元測試（一）詳解的相關(guān)資料,需要的朋友可以參考下2016-09-09
詳解JavaScript的AngularJS框架中的作用域與數(shù)據(jù)綁定
這篇文章主要介紹了JavaScript的AngularJS框架中的作用域與數(shù)據(jù)綁定,包括作用域的繼承以及數(shù)據(jù)的單向和雙向綁定等重要知識(shí)點(diǎn),需要的朋友可以參考下2016-03-03
AngularJS的依賴注入實(shí)例分析(使用module和injector)
這篇文章主要介紹了AngularJS的依賴注入,結(jié)合實(shí)例形式分析了依賴注入的原理及使用module和injector實(shí)現(xiàn)依賴注入的步驟與操作技巧,需要的朋友可以參考下2017-01-01
angularjs實(shí)現(xiàn)搜索的關(guān)鍵字在正文中高亮出來
這篇文章主要介紹了angularjs實(shí)現(xiàn)搜索的關(guān)鍵字在正文中高亮出來，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-06-06
AngularJS的ng Http Request與response格式轉(zhuǎn)換方法
這篇文章主要介紹了AngularJS的ng Http Request與response格式轉(zhuǎn)換方法,結(jié)合實(shí)例形式分析了AngularJS實(shí)現(xiàn)Request與response格式轉(zhuǎn)換操作的相關(guān)設(shè)置與使用技巧,需要的朋友可以參考下2016-11-11
這篇文章主要介紹了angularJS中router的使用方法和示例分享,需要的朋友可以參考下2015-02-02
這篇文章主要介紹了AngularJS用戶選擇器指令,結(jié)合實(shí)例形式分析了angular指令實(shí)現(xiàn)選擇器功能的具體操作步驟與相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2016-11-11
本篇文章主要介紹了AngularJS的ng-click傳參的方法，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-06-06
在AngularJS中主要使用$http服務(wù)與遠(yuǎn)程http服務(wù)器交互，本篇文章主要介紹了AngularJS中$http使用的簡單介紹，非常具有實(shí)用價(jià)值，需要的朋友可以參考下。2017-03-03
AngularJS實(shí)現(xiàn)樹形結(jié)構(gòu)(ztree)菜單示例代碼
這篇文章運(yùn)用示例代碼給大家詳細(xì)介紹了利用AngularJS如何實(shí)現(xiàn)樹形結(jié)構(gòu)(ztree)菜單，文中僅用了幾行AngularJS代碼就是了這個(gè)功能，對(duì)大家日常開發(fā)很有幫助，有需要的朋友們可以參考借鑒，下面來一起看看吧。2016-09-09