把service當作被依賴的資源加載到controller中的方法，與加載到其他服務中的方法很相似。
由于javascript是一個動態(tài)語言，DI不能弄明白應該通過static types（like in static typed languages）注入哪一個service。因此，我們需要通過$inject屬性指定service名稱， 它是一個包含需要注入的service名稱的字符串數(shù)組。service ID順序的重要性：工廠方法中的參數(shù)順序，與service在數(shù)組中的順序一致。工廠方法的參數(shù)名稱并不重要，但是按照慣常的做法，他們與service ID一一匹配，下面將討論這樣做的好處。
1.顯式依賴注入
function myController($scope,$loc,$log) { $scope.firstMethod = function() { //使用$location service $loc.setHash(); }; $scope.secondMethod = function() { //使用$log service $log.info(‘…') };}myController.$inject = [‘$location','$log']; 例子：
<!DOCTYPE HTML><html lang="zh-cn" ng-app="MainApp"><head> <meta charset="UTF-8"> <title>explicit-inject-service</title></head><body><div ng-controller="MyController"> <input type="text" ng-model="msg"/> <button ng-click="saveMsg()">save msg</button> <ul> <li ng-repeat="msg in msgs">{{msg}}</li> </ul></div><script src="../angular-1.0.1.js" type="text/javascript"></script><script type="text/javascript"> var app = angular.module("MainApp",[],function($provide) { $provide.factory("notify",["$window","$timeout",function(win,timeout) { //這里是服務依賴服務，通過這種顯式的方式，參數(shù)名可以亂填，但順序要對應 var msgs = []; return function(msg) { msgs.push(msg); if(msgs.length==3) { timeout(function() { win.alert(msgs.join("/n")); msgs = []; },10); } } }]); }); function MyController($s,$noti) { //這里是controller依賴服務，通過這種顯式的方式，參數(shù)名可以亂填，但順序要對應 $s.msgs = []; $s.saveMsg = function() { this.msgs.push(this.msg); $noti(this.msg); this.msg = ""; }; } //指定注入的東東 //也可以參考http://www.cnblogs.com/lcllao/archive/2012/10/16/2725317.html里面的例子 MyController.$inject = ['$scope','notify'];</script></body></html>2. 隱式依賴注入
angular DI的一個新特性，允許通過參數(shù)名稱決定依賴。讓我們重寫上面的例子，展示如何隱式注入$window、$scope與notify service。
例子：
<!DOCTYPE HTML><html lang="zh-cn" ng-app="MainApp"><head> <meta charset="UTF-8"> <title>implicit-inject-service</title></head><body><div ng-controller="MyController"> <input type="text" ng-model="msg"/> <button ng-click="saveMsg()">save msg</button> <ul> <li ng-repeat="msg in msgs">{{msg}}</li> </ul></div><script src="../angular-1.0.1.js" type="text/javascript"></script><script type="text/javascript"> var app = angular.module("MainApp",[],function($provide) { $provide.factory("notify",function($window,$timeout) { //服務依賴服務，隱式依賴，名稱一致即可 var msgs = []; return function(msg) { msgs.push(msg); if(msgs.length==3) { $timeout(function() { $window.alert(msgs.join("/n")); msgs = []; },10); } } }); }); function MyController($scope,notify) { //服務依賴服務，隱式依賴，名稱一致即可 $scope.msgs = []; $scope.saveMsg = function() { this.msgs.push(this.msg); notify(this.msg); this.msg = ""; }; }</script></body></html> 雖然這樣很方便，但是假如我們需要壓縮、混淆我們的代碼，這可能會導致參數(shù)名稱被更改，遇到這種情況的時候，我們還是需要使用顯式聲明依賴的方式。
以上就是關于AngularJS Injecting Services Into Controllers的資料整理，后續(xù)繼續(xù)補充相關資料，謝謝大家對本站的支持！
新聞熱點
疑難解答
