40

是否可以在 Angular 脚本中创建多个模块？我浏览了文档并了解到它是某种主要方法概念。

我需要例子来证明这一点。

4

5 回答 5

47

是的，您可以在 angularJS 中定义多个模块，如下所示。

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

但是，不要忘记在每个模块声明期间定义依赖项，如下所示。让我们假设 myApp2 依赖于 myApp。因此，声明将类似于，

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

AngularJS 中的模块化有助于我们保持代码清晰易懂，因为我们可以组合多个模块来生成应用程序。但是，我们需要记住，我们应该根据组件的功能而不是类型来模块化组件。

于 2014-09-18T01:12:53.030 回答
28

每个 HTML 文档只能自动引导一个 AngularJS 应用程序。在文档中找到的第一个 ngApp 将用于定义根元素以自动引导为应用程序。要在 HTML 文档中运行多个应用程序，您必须使用 angular.bootstrap 手动引导它们。AngularJS 应用程序不能相互嵌套。-- http://docs.angularjs.org/api/ng.directive:ngApp 另见

https://groups.google.com/d/msg/angular/lhbrIG5aBX4/4hYnzq2eGZwJ http://docs.angularjs.org/api/angular.bootstrap

你也可以只使用一个 ng-app 但像这样组合 2 个模块：

var moduleA = angular.module("MyModuleA", []);
moduleA.controller("MyControllerA", function($scope) {
  $scope.name = "Bob A";
});

var moduleB = angular.module("MyModuleB", []);
moduleB.controller("MyControllerB", function($scope) {
  $scope.name = "Steve B";
});

angular.module("CombineModule", ["MyModuleA", "MyModuleB"]);

接着ng-app="CombineModule"

于 2015-09-07T20:24:39.887 回答
13

我认为他将模块与 ngApp 混淆了，因为页面上只有一个应用程序（ng-app），并且应用程序的视图（ngView 或 <ng-view>）也只能存在一次。但是如前面的答案所述，您可以创建任意数量的模块，并将它们作为依赖项注入到您的“主”应用程序模块中。我通常这样做是为了在它们自己的模块中分离我的指令、过滤器、控制器等。

编辑：

ngApp - http://code.angularjs.org/1.1.5/docs/api/ng.directive:ngApp

于 2013-08-29T14:25:57.890 回答
12

当然可以。只需使用angular.module('moduleName', [/* dependencies */])与您希望创建的模块数量一样多的次数。

要获取对先前定义的模块的引用，只需执行以下操作：var myModule = angular.module('moduleName');然后myModule.controller(...),myModule.config()等myModule.constant()。

建议的项目布局（参见 Angular Seed）有一个用于您的应用程序的模块，另一个用于您的控制器，另一个用于您的服务，另一个用于您的过滤器，还有一个用于您的指令。当然这只是一个建议。其他人建议替代布局。

于 2013-08-29T13:40:46.200 回答
1

你是什​​么意思多个模块？您可以将模块注入另一个模块

angular.module(name[ anotherModule]);
于 2013-08-29T13:39:01.233 回答