我是否需要為與我的角度應用程序相關的每個文件聲明一個角度模塊var？

Question

我想寫指令在directive.js和controller.js寫控制器，但我必須編寫app = angular.module('app')以及有關在每個文件的應用程序的配置？ 有寫它們的簡單方法嗎？

Answer 1

不要簡單回答“ yo angular”。 這使您不了解如何根據應用程序需求來設置自己的構建。

在目錄結構方面，我使用以下內容：

如果您還有其他要進入應用程序的內容，則可以將所有功能移至文件夾，即“模塊”

在我如何啟動我的模塊代碼以及該模塊的關系控制器/指令等方面。 看起來類似於以下塊：

文件：app / foo / foo.js

(function() {

    angular.module('foo', []);

})();

文件：app / foo / controllers / foo.fooController.js

(function() {

    function fooController() {
        // controller code
    }

    angular.module('foo').controller('fooController', fooController);

})();

文件：app / foo / directives / foo.fooDirective.js

(function() {

    function fooDirective() {
        // directive code
    }

    angular.module('foo').directive('fooDirective', fooDirective);

})();

Answer 2

您不必在全局范圍內緩存模塊，只需在每個文件中/每次需要時使用模塊 angular.module('app')的getter語法 angular.module('app') 。 - ：有了這個，你，不要將一個變量前污染全球范圍內app ，以便能夠在其他地方使用它。

controller.js：

//controller def
angular.module('app').controller('myCtrl', MyCtrl);

指令.js：

//directive def
angular.module('app').directive('myDir', MyDir);

只是不要在預期之外的其他地方通過執行angular.module('app',[])重新初始化模塊。

Answer 3

我也為這個概念而苦惱。 歸結為這個。

首先將AngularJS Module視為namespace聲明，然后考慮以下內容。

給定一個名為“ foo”的應用程序名稱空間，您可能有幾個文件組成了您的應用程序，但您希望所有這些文件都只是擴展“ foo”名稱空間。 AngularJS的模塊功能有兩個原型。 第一個帶有兩個參數，第二個只有一個。 在主模塊文件中（我們稱其為首先加載的文件），您將使用兩個參數版本來初始化應用程序並定義希望Angular包括哪些外部模塊。

下面的代碼示例顯示了兩種格式的用法。 第一個顯示了如何執行模塊的初始聲明。 注意第二個參數，它是一個字符串數組，用於標識模塊所依賴的模塊； 即使您沒有依賴項，也必須提供空數組。

//main.js
(function(angular,undefined){
    "use strict";

    angular.module("foo", ["ui-router"]);
})(angular);

在示例的第二部分，您應注意沒有第二個參數。 這基本上告訴Angular您已經在其他地方初始化了模塊，現在您只是嘗試添加到模塊中。

//bar-controller.js
(function(angular,undefined){
    "use strict";

    angular.module("foo")
        .controller("bar", ["$scope", "$state", function($scope, $state){
             //Do controller stuff
        });
})(angular);

至於如何組織文件？ 那取決於你。 對您和您的應用程序有意義的一切。 AngularJS確實不在乎文件系統的結構，除了模板的所有路徑都是相對於“主要” js文件的。

Answer 4

據我了解，您需要知道的是您是否必須在每個將包含Angular代碼的.js文件中聲明一個應用程序變量...（問題的標題與內容不匹配）

簡短答案： 否

說明

您可以通過這種方式聲明一個角度應用

var myAppModule = angular.module('myApp', []); 

這樣您就可以聲明控制器，服務等。

myAppModule.controller('MyCTRL', ['dep1','dep2', function(dep1,dep2){
      //...
 }]);

或者您可以將其聲明為模塊而無需為其分配變量

angular.module('myAppModule', []); 

那么您必須像這樣聲明控制器，服務等

angular.module('myAppModule').controller('MyCTRL', ['dep1','dep2', function(dep1,dep2){
      //...
    }]);

現在，要完全回答您的問題，一旦聲明了模塊，就不必再次聲明它，只需記住在包含de controller，指令，服務等

您還應該檢查一下： 聲明模塊的“最佳”方法