隱式依賴注入在AngularJS中如何工作？

我是AngularJS的新手，我想更多地瞭解默認情況下正在注入的依賴關係。在閱讀代碼時，我注意到有時候依賴關係是事先明確聲明的，有時它們不是。例如：隱式依賴注入在AngularJS中如何工作？

someModule.controller('MyController', ['$scope', 'someService', function($scope, someService) { 
    // ... 
}]);

給出了相同的結果：

someModule.controller('MyController', function($scope, someService) { 
    // ... 
});

這是如何工作的？ Angular是否假設被注入的模塊與參數中的變量命名相同？

而且，奇怪的是，如果你指定要被注入的依賴關係，你必須指定他們的所有，並在正確的順序，否則什麼也不會工作。例如，這是破碼：

someModule.controller('MyController', ['someService', '$scope', function($scope, someService) { 
    // Won't give us any errors, but also won't load the dependencies properly 
}]);

有人可以向我澄清這整個過程是如何工作的？非常感謝你！！

來源

2015-09-24 David Meza

是的，Angular中的依賴注入通過你（和Angular--對於內部的）註冊的組件的名字來工作。

下面是一個示例，顯示瞭如何使用幾種不同的註釋將服務註冊並注入控制器。請注意，依賴注入在Angular中的作用始終如一，即無論您是將某些東西注入控制器，指令還是服務中，都無關緊要。

app.service('myService', function() { 
    // registering a component - in this case a service 
    // the name is 'myService' and is used to inject this 
    // service into other components 
});

兩個用（注）在其他組件這個組件，有三種不同的註解，我意識到：

1.隱註釋

您可以指定一個構造函數將所有依賴關係作爲參數。是的，名字必須是相同的，當這些部件被註冊爲：

app.controller('MyController', function ($http, myService) { 
    // .. 
});

2.內嵌陣列註釋

或者你也可以使用一個數組，其中最後一個參數是用一個符號帶有所有注入項的構造函數（在這種情況下，變量名不重要）。數組中的其他值需要是與注射劑名稱匹配的字符串。 Angular可以通過這種方式檢測注射劑的順序，並做到恰當。

app.controller('MyController', ['$http', 'myService', function ($h, m) { 
    /* Now here you can use all properties of $http by name of $h & myService by m */ 
    // Example 
    $h.x="Putting some value"; // $h will be $http for angular app 
}]);

3 $注入性註釋

第三個選項是指定在構造函數中$inject - 特性：

function MyController($http, myService) { 
    // .. 
} 
MyController.$inject = ['$http', 'myService']; 
app.controller('MyController', MyController);

之所以最後兩個選項可用，至少據我所知，是由於在縮小導致參數名稱被重命名的JavaScript文件時發生的問題。然後Angular無法檢測到要注入的內容。在後面兩種情況下，注射劑被定義爲字符串，在縮小過程中未被觸摸。

我會建議使用版本2或3，因爲版本1不適用於縮小/混淆。從我的角度來看，我更喜歡版本3，這是最明確的。

你可以在網上找到一些更詳細的信息，例如：在Angular Developer Guide。

來源

2015-09-24 05:17:27 PzYon

at「2.行內數組註釋」：「數組中的其他值需要是與注射劑名稱匹配的字符串。」 =>我認爲'$ htt'不是一個有效的angularjs注入，也許@PzYon意味着輸入'$ http'而不是？！ – Ronin

隱式依賴注入在AngularJS中如何工作？

回答

相關問題