单独文件中的控制器抛出错误

时间:2016-02-17 15:11:27

标签: angularjs

我正在将我的控制器从包含我的整个应用程序的一个唯一文件移动到单独的文件并得到该错误:"错误:[ng:areq]参数' MainCtrl'不是一个功能,未定义"

我使用设置方法在app.js中定义我的应用程序:

var app = angular.module('CMT', ['ui.router', 'angularCharts', 'uiSwitch']);

然后我用:

创建了一个MainCtrl.js文件
    angular.module('CMT').controller('MainCtrl', [
'$scope', 'reviews', '$location',
function($scope, reviews, $location){

}]);

我在包含角度源代码后将文件包含在index.html中:

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.10/angular-ui-router.js"></script>
<script src='library/d3.min.js' type='text/javascript'></script>
<script src='library/angular-charts.min.js' type='text/javascript'></script>
<script src="node_modules/angular-ui-switch/angular-ui-switch.min.js"></script>

<script src="app.js" type='text/javascript'></script>
<script src="MainCtrl.js" type='text/javascript'></script>

任何提示或解决方案?

2 个答案:

答案 0 :(得分:0)

app.js 文件之前指定所有服务/控制器/过滤器/指令文件

<script src="MainCtrl.js" type='text/javascript'></script>
<script src="app.js" type='text/javascript'></script>

注意:如果将所有脚本文件捆绑到单个文件中,则不需要关心这些文件订单

答案 1 :(得分:0)

尝试以下方法:

app.js中,注入MainCtrl.js,例如:

var app = angular.module('CMT', ['ui.router', 'angularCharts', 'uiSwitch', 'CMT.MainCtrl']);

在您的MainCtrl.js

angular.module('CMT.MainCtrl', [])

编辑:

AngularJS module是一个容器。在每个Angularjs应用程序中,您都有一个“主”模块,通常有许多子模块。这些子模块可用于将应用程序模块化/分离为组件,如控制器,服务等。最初,您有一个主模块,其中还包含控制器的代码。当您决定将控制器移出主模块时,您想要做的是将其移动到子模块中。

所以你做了两件事:

  1. 您将控制器模块(在本例中是您的子模块)命名为与您的app / main模块名称'CMT'相同的名称。您的子模块需要具有唯一的名称,最好使用.分隔符 - 请参阅此Angular style guide

  2. 您没有以Angular方式将控制器模块“链接”到您的应用模块。只是将脚本添加到您的html是不够的。如果您有一个名为CMT.MainCtrl的子模块,则需要将其注入主CMT模块。

  3. 根据您的命名约定MainCtrl.jscontrollers.js之类的内容进行判断,我猜您是按功能而不是按类型组织代码?无论如何,请阅读Angular best practices以获取有关Angular目录结构的更多信息。