如何模块化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应用程序（文件夹结构）？

回答

相关问题