如何模塊化AngularJS應用程序（文件夾結構）？

假設我將與3個模塊開始新AngularJs應用：如何模塊化AngularJS應用程序（文件夾結構）？

登錄
支付
查詢

我想同樣加載payment模塊login細節enquiry，如何我們能做到這一點嗎？

我將有1分登陸界面，它將調用服務器並檢查登錄，之後服務器將與一些參數，我將在支付和查詢模塊使用響應。

如果我加載與其他2個模塊登錄模塊：

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

這將加載在登錄兩個模塊（我不知道），但我想是這樣的：

var myModule = angular.module('myApp', ['login']); 
// i.e for payment: 
var myModule = angular.module('payment', ['login']); 
// and for enquiry: 
var myModule = angular.module('enquiry', ['login']);

只有登錄應該加載。我將在這裏使用登錄參數。

有什麼建議嗎？

來源

2014-07-21 Prashanth bhat

首先，你是不是「裝」與語法的模塊，只有確保他們在正確的順序初始化。加載模塊是通過將它們包含在index.html頁面中來完成的（或者使用requirejs或類似的方法，但這會使它成爲一個完全不同的野獸）。

假設你正在建設一個SPA（單頁應用程序），你只會有一個主模塊，這將有直接或間接引用您要使用的所有其它模塊。所以，如果你按照你想要的方式去做，你將永遠無法獲得付款或查詢。所以，你應該做的：

在app.js

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

在payment.js

var myModule = angular.module('payment', ['login']);

在enquiry.js

var myModule = angular.module('enquiry', ['login']);

在login.js

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

index.html中

<html ng-app="myApp"> 
... 
<script src="app.js"></script> 
<script src="payment.js"></script> 
<script src="enquiry.js"></script> 
<script src="login.js"></script> 
... 
</html>

請記住，因爲你會被包括在你的index.html將「負載」的所有代碼總是不管你如何定義你的模塊，你會爲這些JavaScript代碼也只有一個模塊「綁定」到您的應用程序，並且該模塊必須有權訪問您所包含的所有其他模塊。

如果你想做延遲加載（加載資源（模塊，控制器，過濾器，提供程序等），當你需要它們時，這是一個完全不同的野獸，並且在你的應用程序中還需要很多額外的代碼作爲一些使用angularjs的方法，除非你使用了一些東西，http://marcoslin.github.io/angularAMD/#/home。還有一個很好的討論，如果你應該或不應該使用延遲加載在這裏：Does it make sense to use Require.js with Angular.js?

來源

2014-09-22 05:53:05

最後一段是相當自負;也許參考[AngularJS + RequireJS：正確和容易的方式]（http://marcoslin.github.io/angularAMD/#/home）是按順序的。或者[對Angular.js使用Require.js是否有意義？]（http://stackoverflow.com/questions/12529083/does-it-make-sense-to-use-require-js-with-angular -js）（stackoverflow.com） –

如何模塊化AngularJS應用程序（文件夾結構）？

回答

相關問題