控制器在Ionic中的單獨文件中包含訂單

Question

我開始編寫一個Ionic應用程序並開始編寫我的視圖和控制器。 我想使用制表符布局。

為清楚起見，我想將控制器分成不同的文件。

我的控制器 - 文件夾：

• controller.js
• main.js
• tabs.js

controller.js包含：

angular.module('myApp.controllers', []);

main.js包含：

angular.module('myApp.controllers', ['myApp.services','ionic'])
  .controller('MainCtrl', function ($scope) {
    $scope.name = "Test";
  });

tabs.js包含：

angular.module('myApp.controllers', ['myApp.services','ionic'])
  .controller('TabsCtrl', function ($scope) {

  });

在app.js中我指定了我的路線：

.state('tab', {
    url: '/tab',
    abstract: true,
    templateUrl: 'app/templates/tabs.html',
    controller: 'TabsCtrl'
  })


  .state('tab.main', {
    url: '/main',
    views: {
      'tab-main': {
        templateUrl: 'app/templates/main.html',
        controller: 'MainCtrl'
      }
    }
  })

最后在我的index.html中，我在標題中包含了所有使用過的文件：

    <script src="app/app.js"></script>
    <!-- Controller-Definition -->
    <script src="app/controller/controller.js"></script>
    <script src="app/controller/tabs.js"></script>
    <script src="app/controller/main.js"></script>

我的問題是在瀏覽器中我得到錯誤：

參數'TabsCtrl'不是函數，未定義

我不知道為什么它不起作用！

當我更改index.html文件中tabs.js和main.js的順序時，我得到：

參數'MainCtrl'不是函數，未定義

有人可以幫我解決這個問題嗎？ 它可能是一個小而簡單的東西，但我不明白:-)

Answer 1

您在每個文件中覆蓋'myApp.controllers'模塊。 試試這個：controller.js：

angular.module('myApp.controllers', ['myApp.services','ionic']);

main.js：

angular.module('myApp.controllers')
  .controller('MainCtrl', function ($scope) {
    $scope.name = "Test";
  });

tabs.js

angular.module('myApp.controllers')
  .controller('TabsCtrl', function ($scope) {

  });