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

我试图将控制器拆分为多个文件，但当我尝试在模块中注册它们时，我收到一个错误：

groupcontroller.coffee

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

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

usercontroller.coffee

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

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

错误

错误：参数“GroupController”不是函数，未定义

从文档中，我并没有真正了解模块方法到底做了什么。它是否使用“Webchat”键存储我的控制器

编辑： 传递[]似乎也会创建一个新模块并覆盖上一个模块

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

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

app = angular.module('WebChat');

---

检查代码中引用“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”需要在路线中加引号。

以下是我所做的：

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>

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中也会有很多脚本元素。
我还不知道该怎么处理

供参考：

---

但是本文也没有提到html文件。

我在app.js文件中定义了我的app var，它首先被引用，然后是控制器文件，例如FirstCtrl.js

所以在app.js中

var app = angular.module(...

在FirstCtrl.js中

app.controller('FirstCtrl',

---

这个问题有一个简单的解决办法。 编译前连接*.coffee文件。 如果使用“gulp”，您可以创建如下任务：

 gulp.src(['./assets/js/ng/**/*.coffee'])
    .pipe(concat('main.coffee'))
    .pipe(coffee())
    .pipe(ngmin())
    .pipe(gulp.dest('./public/static/js/app'))
    .pipe(livereload(server));

例如：

聊天，咖啡

myChat = angular.module 'myChat', []

味精咖啡

myChat
.directive 'message', () ->
    return {
        restrict: 'E'
        replace : true
        transclude: true
        scope: true
        template: '<div></div>' 
    }

myChat
.指令“消息”，（）->
返回{
限制：“E”
替换：正确
转移：对
范围：真
模板：“”
}

连接和编译后，我们有：

(function () {
  var myChat;
  myChat = angular.module('myChat', []);
  myChat.directive('message', function () {
    return {
      restrict: 'E',
      replace: true,
      transclude: true,
      scope: true,
      template: '<div></div>'
    };
  });

}.call(this));

（函数（）{
var-myChat；
myChat=angular.module（'myChat'，[]）；
myChat.directive（'message'，function（）{
返回{
限制：'E'，
替换：正确，
是的，
范围：正确，
模板：“”
};
});
}.叫（这个）；

---

享受吧

+1用于解释将

[]

作为模块方法的第二个参数传递将覆盖前一个参数的编辑。@user1703761:谢谢+1用于编辑。html页面上的顺序很重要，我用grunt和concat构建了一个js文件，但在将angular.module声明放在第一位之后，出现了一个错误，即找不到模块xy（一切正常：-）。