Angularjs - 分離指令文件，但住在同一個模塊

Question

我想一個指令分離到另一個文件上，而不需要聲明一個新的模塊 - 不這樣做：

angular.module('myapp.newmodule',[]).directive 

只是：

angular.module（「myapp.directives」）指令（「」

的myapp.directives模塊存在於另一個文件，並運行良好。但是當我嘗試在另一個文件中使用它，如上圖所示（不[] ）它失敗了。

以下this answer它認爲我的方法應該可行，但由於某種原因失敗..

Answer 1

當你第一次聲明一個模塊時，它需要有依賴參數。之後，您可以僅使用模塊名稱參數引用相同的模塊。

/* create module */ 
angular.module('myapp.newmodule',['ngRoute','ngResource']); 

/* declare components of same module, note same name*/ 
angular.module('myapp.newmodule').directive.... 

如果你想創建新的模塊，你需要的主要ng-app模塊依賴關係注入其中。

/* main ng-app module , injects another module you created below*/ 
angular.module('myapp.newmodule',['ngRoute','ngResource','myUploader']); 

/* new module, must have dependency argument */ 
angular.module('myUploader',[]).directive... 

Answer 2

你不需要鏈在一起，你發佈的鏈接有在這個問題底部的答案。

在您需要創建您的應用程序模塊的第一個文件：

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

然後在每個文件可以附加額外的東西myApp：

myApp.directive('ngValidate', ['$parse', function ($parse) { 
    .... 
}]); 

個人而言，我從來沒有在一起連鎖這個東西，相反，我把它放在單獨的文件中。

Answer 3

無論它只是指模塊名稱（即使在不同的文件中）並附加指令。 JavaScript只會看到附加到模塊的內容，而不會看到它來自哪個文件。

file1.js

angular.module('module-name') 
    .directive('directive1', function() { 
     return { 
      .... 
     }; 
    }); 

file2.js

angular.module('module-name') 
    .directive('directive2', function() { 
     return { 
      .... 
     }; 
    }); 

唯一的一點是不要忘記包括在查看HTML文件中的js文件。 說 的index.html

<script src="file1.js"></script> 
<script src="file2.js"></script>