具有多个模块和常规功能的Angular应用程序

Question

Angular模块是我们从.net世界中了解到的一种命名空间功能。保留模块中的内容。

问题是我想这样做：

1. 我希望某些页面没有任何特定的客户端功能，但使用自定义指令只定义ng-app或ng-app="xyz"才能正常工作;我不想引入额外的Javascript代码（文件）以使其正常工作。

2. 我希望网页包含不同的模块，即App.Main和App.Specific;这两个页面都应该使用＃1中的相同指令并使用它们。

3. 我想在App.General模块中包含一般内容，然后提供其他模块，如提到的App.Main和App.Specific。

问题

应该在哪个模块中定义指令，以及这些模块之间的依赖关系（如果它们不以任何方式调用彼此的代码）应该如何使指令和页面按预期工作？

Answer 1

如果我正确理解您的问题，我的建议是在同一个javascript文件中定义几个角度应用模块，并通过ng-app="App.General"指令vs ng-app="App.Specific"为每个页面激活相应的模块。所以你可以拥有一个包含以下内容的连接javascript文件：

• angular.js
• 您正在使用的任何第三方依赖项
• 您的自定义指令，服务，控制器等
  • 我建议使用＆＃34;非常精细的模块＆＃34;作为recommended at the NYC AngularJS Meetup Feb 2014 at 24m in this video并将每个指令和服务放入其自己的模块中。
  • 但是将所有共享指令分组到一个名为＆＃34; App.Directives＆＃34;的单个模块中也可以。
• 由angular.module('App.General', ['MyDirective']);定义的通用代码（加上其他依赖项）
• 由angular.module('App.Specific', ['MyDirective', 'MyService']);定义的特定代码（加上其他依赖项）

另请注意，您不必将应用依赖项声明为字符串字符串。您可以var directives = ['Dir1', 'Dir2'];然后angular.module('App.Specific', directives.concat('MyService', 'MyController'));表示特定应用使用与常规应用相同的指令。

每个页面都可以包含相同的<script src="/bundle.js"></script> HTML（因此只能在网络上加载一次然后缓存）。

常规页面会在其HTML中包含ng-app="App.General"。具体页面为ng-app="App.Specific"。

  

某些页面没有任何特定的客户端功能但使用自定义指令

因此，指令在技术上构成了客户端功能＆＃34;因为它们将在浏览器中呈现为最终的HTML。因此，您需要加载angular.js，包含您的指令的模块以及至少一行代码来定义应用程序并声明它对提供您正在使用的自定义指令的模块的依赖性。