Question

我有两个模块如下。

var module1 = angular.module('myApp',['ngAnimate','ngTouch']
   .controller('MainCtrl', function ($scope)){
   });

var module2 = angular.module('myApp',[]);
    module2.controller('NameCtrl',function($scope)){

    });

和Html在这里

<body ng-app='myApp'>
    <div ng-controller='MainCtrl'> //Code here</div>
    <div ng-controller='NameCtrl'>//Code here</div>
</body>

但这会抛出这样的错误。＆＃39; NameCtrl＆＃39;不存在

请让我知道如何解决这个问题。提前致谢

Answer 1

正确的结构看起来像这样......

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

myApp.controller('MainCtrl', function($scope){

});


myApp.controller('NameCtrl', function($scope){

});

<强>记住每个模块都像一个单独的应用程序。每个模块都必须是一个唯一的名称，每个模块都可以有自己的配置，控制器，服务等。

Answer 2

您不需要2个模块。

module1.controller('NameCtrl',function($scope)){

    });

是你想要的

Answer 3

您使用同名声明两个不同的模块。你不能这样做。

angular.module方法是jQuery-like getter和setter。如果您使用仅使用一个参数来调用它，那么它将作为getter使用，如果您使用两个或更多参数调用它，则它将作为{ {1}}。

因此，如果你需要（似乎）只注册另一个配方（控制器，服务，ecc。）而不是新模块，你需要setter。

否则，如果您需要新模块，则需要为其指定一个不同的名称，并通过angular.bootstrap手动引导它

Answer 4

这是你要找的人吗？

var modules = angular.module('myApp',['ngAnimate','ngTouch']
  .controller('MainCtrl', function ($scope)){


 });

  modules.controller('NameCtrl',function($scope)){

});

Answer 5

您无法使用相同的名称声明两个模块。您可以在同一模块中使用不同的controller, service, directive, factory等，这样您就不需要为简单的应用程序使用不同的模块。

如果需要在同一模块中使用不同的控制器，请使用

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

   myModule .controller('MainCtrl', function ($scope){
      //code
   });

    myModule .controller('NameCtrl', function($scope){
       //code
    });

如果需要不同的模块，则需要不同的名称。可以为那些基于模块的应用程序使用不同的模块。

Answer 6

您不能拥有两个名称相同的模块。如果您的项目是以某种方式构建的，那么真正阻止您只使用一个模块，您可以这样做。

var module2 = angular.module('myModule2',[]);
module2.controller('NameCtrl',function($scope) {...});

var module1 = angular.module('myApp',['ngAnimate','ngTouch', 'myModule2']
   .controller('MainCtrl', function($scope){...});

Answer 7

要将您的应用程序分解为多个模块，您需要将应用程序和组件命名为不同的内容，并使您的应用程序依赖于您的组件。

var myComponent = angular.module('myComponent',[]);
myComponent.controller('NameCtrl',function($scope)){});

var anotherComponent = angular.module('anotherComponent',[]);
anotherComponent.controller('NameCtrl',function($scope)){});

var myApp = angular.module('myApp',['ngAnimate','ngTouch', 'myComponent', 'anotherComponent']);
myApp.controller('MainCtrl', function ($scope)){});

Answer 8

这有点令人困惑，因为根据docs，通过声明module2，你覆盖已经存在的myApp模块，这将导致MainCtrl不存在。考虑尝试Wainage建议的内容，或者，如果您确实需要两个单独的模块，请执行以下操作：

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

module1.controller('NameCtrl',function($scope){
    $scope.value = 'Name controller value';
});
var myApp = angular.module('myApp', [/*Other dependencies*/'myApp.module1']);
myApp.controller('MainCtrl', function ($scope){
    $scope.value = 'Main value';
});

Answer 9

您不需要创建两个模块。

您可以按照以下方式实施所需内容。

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

myComponent.controller('MainCtrl',function($scope)){

};

myComponent.controller('NameCtrl',function($scope)){

};

如何在AngularJS中集成两个模块

9 个答案: