角模塊依賴注入不按預期工作

Question

所以我有麻煩管理我的節點應用程序的依賴關係。的結構如下

app.js

var app = angular.module('myApp', ['myController', 'myFactory', 'rzModule', 'chart.js', 'myService', 'selector']); 

myController.js

var app = angular.module('myApp', ['chart.js', 'rzModule', 'selector']); 
app.controller('myController', function($scope, $http, $rootScope, myFactory, mySecondService){ ... }]); 

myFactory.js

angular.module('myApp').factory('myFactory', function($http, $rootScope){ ... }); 

myService.js

angular.module('myApp').service('myService', function($http){...}); 

上面的結構工作，應用程序按預期運行。但是我不認爲我在myController.js中所做的是正確的，因爲我現在想要添加另一個依賴關係，並且我不知道如何在沒有應用程序崩潰的情況下執行此操作。

問題1：在上面的myController.js中，我想我正在創建一個新模塊，而不是重用app.js中的一個，是否正確？如果是這樣，內嵌移動3依賴性就像下面這個結果「是myController的不可用」：

var app = angular.module('myApp'); 
app.controller('myController',['chart.js', 'rzModule', 'selector', function(...) 

爲什麼這個不行？根據documentation它應該。我想將angular-moment添加到myController中。該指示說我應該將'angularMoment'作爲依賴項添加到app.js，然後'moment'添加到控制器依賴項。如果我這樣做，並像問題1一樣添加內聯'moment'，則我再次遇到「myController不可用」錯誤。

Answer 1

所以回答你的問題 快的事情，你有angularjs繼續之前，模塊需要注入器應用程序沒有到控制器，所以任何模塊，包括需要在應用中被注入。

var app = angular.module('myApp', [<all modules comma separated>]); 

同樣的控制器可以有這些模塊定義了注入myApp

你不能注入控制器，其要麼鏈接到myApp（如服務，工廠等）所有這些依賴關係和這些服務在對myApp只有模塊的服務可以有

注入問題1

var app = angular.module('myApp', ['chart.js', 'rzModule', 'selector']); 
app.controller('myController', function(...) 

這shold工作，並利用這一點，並不意味着你正在創建任何新的應用程序

問題2

var app = angular.module('myApp', ['angularMoment']); 
app.controller('myController', ['moment', function(...) 

這樣你可以使用瞬間的對象。

Answer 2

正如Satpal說

app.controller('myController',['chart.js', 'rzMo 

是要走的路，或者寫這將是做這樣的事情一個更清潔的方式。

angular.module('myApp').controller('myController'); 

myController.$inject = ['$scope', '$http', '$rootScope', 'myFactory', 'mySecondService'] 

function myController($scope, $http, $rootScope, myFactory, mySecondService){} 

原因myController不可與修復的是，它現在你沒有覆蓋的主要應用模塊，它在尋找一個叫myController模塊不能被發現（因爲它是一個控制器，而不是一個模塊）。所以刪除'myController'從var app = angular.module('myApp', ['myController'

我建議你看看John Papa's Style Guide for AngularJS它可以有助於編寫乾淨的代碼。

Answer 3

Ans 1： 是的，在第二種情況下，您正試圖再次定義它。 要定義一個應用程序使用：

angular.module('myApp', [..list of dependancies...]); 

現在，如果你想在前面的模塊使用定義控制器

angular.module('myApp').controller(); 

現在來注入你的3個依賴關係，它們移動到已定義的頂你應用程序。回答2：您必須向您的控制器注入angularMoment到您的應用程序和時刻。

在angular中處理依賴注入的最好方法是使用$ inject。比如你控制器看起來像

angular.module('myApp').controller('myController', myController); 

myController.$inject = ['moment','$scope', '$http', '$rootScope', 'myFactory', 'mySecondService'] 
function myController(moment, $scope, $http, $rootScope, myFactory, mySecondService){ 
    //your controller code. 
} 

，否則你可以嘗試以下以及

angular.module('myApp').controller('myController',['moment','$scope', '$http', '$rootScope', 'myFactory', 'mySecondService', function myController(moment, $scope, $http, $rootScope, myFactory, mySecondService){ 
    //your controller code. 
}]); 

下也可以工作，但不推薦使用;

angular.module('myApp').controller('myController',function myController(moment, $scope, $http, $rootScope, myFactory, mySecondService){ 
     //your controller code. 
    });