AngularJS初始化控制器模塊

Question

我想將我的WebApp分隔為指令，服務，控制器等不同模塊，就像角度種子一樣。 以某種方式在controllers.js中定義的controllers.js似乎不起作用。

<ul class="menu" ng-controller="MenuController">
    <li>{{hello}}</li>
</ul>

在app.js我定義了全局App模塊及其子模塊。

// Declare app level module which depends on filters, and services
angular.module('myApp', [
    'myApp.filters',
    'myApp.services',
    'myApp.directives',
    'myApp.controllers'
]);

在controllers.js我試圖定義一個不會加載的控制器。 頁面呈現后，我只會看到{{hello}} 。

angular.module('myApp.controllers', []).
  controller('MenuController', function($scope) {
     $scope.hello = "world"; 
  });

如何將控制器附加到其模板對應物上？

Answer 1

問題是因為未定義其他模塊。 如下所示修改myApp模塊：

angular.module('myApp', [

    'myApp.controllers'
]);

http://jsbin.com/osOQOYag/2/edit?html,js,output

Answer 2

似乎angular-seed在/app/index.html具有以下腳本/app/index.html ：

<script src="lib/angular/angular.js"></script>
<script src="lib/angular/angular-route.js"></script>
<script src="js/app.js"></script>
<script src="js/services.js"></script>
<script src="js/controllers.js"></script>
<script src="js/filters.js"></script>
<script src="js/directives.js"></script>

正如@KhanhTO在評論中指出的， app.js應該最后被調用。