AngularJS:如何在多个文件中创建控制器

Question

我正在尝试将我的控制器分成多个文件,但是当我尝试在我的模块中注册它时我得到一个错误:

groupcontroller.coffee

app = angular.module('WebChat', []);
app.controller 'GroupController', ($scope) -> 

usercontroller.coffee

app = angular.module('WebChat', []);
app.controller 'UserController', ($scope) -> 

错误

错误:参数'GroupController'不是函数,未定义

从文档中我还没有真正得到模块方法所做的事情.它是否用"网聊"键存储我的控制器？

编辑: 似乎传递[]创建一个新模块并覆盖前一个模块

app = angular.module('WebChat', []);

为了防止这种情况,你必须省略[]之类的

app = angular.module('WebChat');

Answer 1

这是我做的:

的index.html

<script src="js/angular.js" type="text/javascript" charset="utf-8"></script>
<script src="js/myApp.js" type="text/javascript" charset="utf-8"></script>
<script src="js/myCtrlA.js" type="text/javascript" charset="utf-8"></script>
<script src="js/myCtrlB.js" type="text/javascript" charset="utf-8"></script>

app.js

myApp = angular.module('myApp', [])
myApp.config ($routeProvider) ->
    $routeProvider.when('/a', {controller: 'myCtrlA', templateUrl: 'a.html'})
    $routeProvider.when('/b', {controller: 'myCtrlB', templateUrl: 'b.html'})

myCtrlA.js

angular.module('myApp').controller 'myCtrlA', ($scope) ->
    console.log 'this is myCtrlA'

myCtrlB.js

angular.module('myApp').controller 'myCtrlB', ($scope) ->
    console.log 'this is myCtrlB'

正如你所看到的,如果我有很多控制器js文件,那么index.html中也会有很多脚本元素.
我不知道该怎么处理.

仅供参考:http://briantford.com/blog/huuuuuge-angular-apps.html
但是这篇文章也没有提到html文件.

Answer 2

检查代码中您引用"GroupController"的其他位置(可能在您的路线中).你可以将它作为一个变量,但是当你在一个模块中声明一个控制器时,你必须用它来包装它.例如:

MyCtrl1() = -> ()
...
$routeProvider.when('/view1', {templateUrl: 'partials/partial1.html', controller: MyCtrl1})

工作正常,因为MyCtrl1是一个变量.但是当您在模块中声明控制器时:

app = angular.module('WebChat', []);
app.controller 'GroupController', ($scope) ->
   # ...

$routeProvider.when('/view1', {templateUrl: 'partials/partial1.html', controller: 'GroupController'})

'GroupController'需要路线中的引号.