Question

我的角度应用结构就像这样

  Controllers.js

     angular.module('RateRequestApp.controllers', []).
            controller('ReadOnlyController', function($scope, rateRequestService) {

            });

        angular.module('RateRequestApp.controllers', []).controller('ModalInstanceCtrl', function ($scope, $modalInstance, items) {

        });

        angular.module('RateRequestApp.controllers', []).controller('ModalDemoCtrl', function ($scope, $modal, $log) {

        });

    App.JS

        angular.module('RateRequestApp', [
       'RateRequestApp.services',
       'RateRequestApp.controllers',
       'ui.bootstrap'
    ]);

HTML

<div id="RateRequestApp" class="content" ng-app='RateRequestApp' ng-controller="ReadOnlyController">
    <form name="palletForm" novalidate>

        <div ng-controller="ModalDemoCtrl">
            <script type="text/ng-template" id="myModalContent.html">

            </script>


        </div>


    </form>
</div>

一切看起来都没问题，但这会引发错误

  Error: [ng:areq] Argument 'ReadOnlyController' is not a function, got undefined

任何人都可以指出我做错了吗？

Answer 1

您多次声明新模块“RateRequestApp.controllers”。

每次你这样做：

angular.module('RateRequestApp.controllers',[])

您重新定义模块'RateRequestApp.controllers'，因为您在第二个参数中声明了依赖项（尽管为空）。当你这样做时：

angular.module('RateRequestApp.controllers', []).
        controller('ReadOnlyController', function($scope, rateRequestService) {

        });
    angular.module('RateRequestApp.controllers', []).controller('ModalInstanceCtrl', function ($scope, $modalInstance, items) {

    });
    angular.module('RateRequestApp.controllers', []).controller('ModalDemoCtrl', function ($scope, $modal, $log) {

    });

第二个定义抛出第一个，第三个抛出第二个。请参阅此处https://docs.angularjs.org/api/ng/function/angular.module向下滚动到“Usage”并查看“requires”arg的详细信息：“如果已指定，则创建新模块。如果未指定，则检索模块以进行进一步配置。”

要么这样做（请注意只有第一个.module()有要求）：

angular.module('RateRequestApp.controllers', []).
        controller('ReadOnlyController', function($scope, rateRequestService) {

        });
    angular.module('RateRequestApp.controllers').controller('ModalInstanceCtrl', function ($scope, $modalInstance, items) {

    });
    angular.module('RateRequestApp.controllers').controller('ModalDemoCtrl', function ($scope, $modal, $log) {

    });

或更简单：

angular.module('RateRequestApp.controllers', []).
        controller('ReadOnlyController', function($scope, rateRequestService) {

        }).controller('ModalInstanceCtrl', function ($scope, $modalInstance, items) {

    }).controller('ModalDemoCtrl', function ($scope, $modal, $log) {

    });

Answer 2

使用以下代码创建模块：angular.module('RateRequestApp.controllers', [])

然后通过获取类似

的模块在该模块上定义不同的控制器

angular.module('RateRequestApp.controllers')
  .controller('ModalDemoCtrl', function($scope, $modal, $log) {});

将[]传递给模块定义会创建一个新模块。

我的角度应用程序结构出错

2 个答案: