AngularJS 依賴注入

2021-07-16 05:39:57 字數 1882 閱讀 7742

本篇文章參考自angularjs權威教程。

乙個物件通常有三種方式可以獲得對其依賴的控制權。依賴注入是通過第三種方式實現的,其優點在於去除對依賴關係的硬編碼,可以在執行時改變甚至移除依賴關係。第一種方法和第二種,呼叫者和被呼叫者或和生產被呼叫者的工廠耦合在一起,第二種還會汙染全域性作用域。

angularjs一共提供了三種注入宣告方式。

($scope,myservice) );

var myfunction = function

(a,b) ;

myfunction.$inject = ["$scope","myservice"]; //注入依賴,現在引數a代表$scope服務,引數b代表myservice自定義服務

(a,b) );

angularjs使用注入器服務$injector來管理依賴關係的查詢和例項化,所有的元件,包括應用的模組、指令、控制器和服務都是由$injector例項化的。使用angular的injector()方法可以獲取$injector服務,該方法接受乙個可選引數,引數值為乙個陣列,包含了需要繫結的模組,另外每次呼叫該方法,返回的都是不同的注入器物件。

var

$injector = angular.injector(); //沒有繫結任何模組的注入器,無法通過get方法得到任何服務例項

var

$injector有以下api。

var myfunction = function(a,b) ;

var $injector = angular.injector();

console.log($injector.annotate(myfunction)); //["a","b"],在沒有顯式宣告依賴時,簡單的返回引數列表

myfunction.$inject = ["$scope","myservice"];

console.log($injector.annotate(myfunction)); //["$scope","myservice"],顯式宣告依賴後,與引數無關,與函式物件的$inject屬性相同

() ;

});var

console.log($injector.get("myservice")); //object

() ;

});var

$injector = angular.injector();

console.log($injector.has("myservice")); //false

console.log($injector.has("myservice")); //true

function

myobject

(name,age)

var $injector = angular.injector();

console.log($injector.instantiate(myobject,)); //myobject 引數

型別含義

fnfunction

要呼叫的函式,invoke()函式返回值就是該函式的返回值

self

object(可選)

允許我們設定呼叫方法的this引數

locals

object(可選)

提供另一種傳遞引數的方式

function myobject (age)

var $injector = angular.injector();

console.log($injector.invoke(myobject,,)); //張三18,this.name是通過第二個引數直接設定的,this.age是通過第三個引數傳進去在函式中設定的,invoke函式的返回值就是第乙個引數的返回值

AngularJS 注入依賴基本用法

0.常用的注入依賴方法有value,factory,service,provide 以及constant.1.感覺注入依賴把現有建立的服務作為乙個function的引數,那麼該function就可以使用已有的服務的內部的函式。2.將服務作為物件來看,就是可以呼叫物件的方法。charset utf 8...

AngularJS學習筆記九 依賴注入

1.angularjs中的依賴注入 控制反轉是一種軟體設計思想,而依賴注入就是實現控制反轉最直接也是最簡單的方式,控制反轉就不一定需要通過依賴注入來實現 所謂的依賴注入,就是當你在乙個元件中需要依賴其他元件的時候,不需要自己建立這些元件,而是通過依賴注入的方式直接獲得這些元件 獲取依賴可以通過三種方...

AngularJS 模組化與依賴注入

angularjs 使用模組化的組織方式,和依賴注入的設計。這使得模組之間耦合度較低,模組更容易復用。同時支援宣告式的程式設計風格。在你建立angular module 或者 service 之前,首先需要了解一下 angular module 和 service 的工作方式。在angular中,乙...