如何在angularjs中分离控制器文件

我看了各种分离文件的例子。我可以理解它们，但问题在于我的代码的方式。我想在不同的文件中分开这些控制器

'use strict';
angular.module('myModule', ['ui.bootstrap']);
var myApp = angular.module('myApp', []);

myApp.config(['$httpProvider', function ($httpProvider) {
$httpProvider.defaults.useXDomain = true;
delete $httpProvider.defaults.headers.common['X-Requested-With'];
}]);

myApp.config(['$routeProvider',

function ($routeProvider) {
$routeProvider.when('/getplaces', {
    templateUrl: 'templates/getplaces.html',
    controller: 'ListCtrl'
})

下面的控制器需要位于不同的文件中

---

我有20多个以上的控制器。但是如何将它们分开。

这应该很容易做到，我会将我的应用程序路由配置组织到主app.js文件中

myApp.config(['$routeProvider',

    function ($routeProvider) {
    $routeProvider.when('/getplaces', {
        templateUrl: 'templates/getplaces.html',
        controller: 'ListCtrl'
    }).when('/getmonth', {
        templateUrl: 'templates/getmacs.html',
        controller: 'MonthlyCtrl'
    })
}])

然后，在每个文件中创建单独的控制器时，只需引用应用程序名称即可：

myApp.controller('MonthlyCtrl', ['$scope', '$http', function ($scope, $http) {  
    $scope.visible = true; 
}])

---

您还将注意到我正在使用数组初始值设定项方式，这将在您进行缩小时为您节省一些时间。

您可以遵循以下约定：

首先加载所有库依赖项，如

angular、angular routes等

然后是包含模块声明的

config

holder js文件

然后使用控制器方法创建所有其他文件

---

我会将特定模块映射到功能（而不是按层），每个模块都包含相关的控制器、服务和适当的指令

例如，您将有一个名为“places.list”的模块，其中包含与之相关的所有控制器、服务/工厂和指令

规则是：一个模块，一个文件，否则您将被迫按顺序声明这些文件。。。（首先是模块声明，然后是控制器等）

如果以正确的方式拆分模块，您会注意到每个模块都很容易维护，并且通常不包含大量代码

甚至每个路由声明（

.config

）都会在这些模块中进行拆分。 =>所有与地点相关的路线都将在模块

地点内声明。列表


事实上，在主模块中声明整个导航规则会很难看（也很难维护）

因此，通过只加载与测试相关的特定模块的依赖项，每个模块都可以很容易地进行测试
 以下是您应该如何做

第一次声明

angular.module('appName', ['Module1', 'Module2', 'Service1']);

随后的声明

在这里，所有控制器和服务都可以放在单独的文件中

angular
    .module('Module1', [])
    .controller('AbcController', ['$scope', '$timeout', 'Service1', function ($scope, $timeout, service1) {} ]);

angular
    .module('Module2', [])
    .controller('EfgController', ['$scope', '$timeout', 'Service1', function ($scope, $timeout, service1) {} ]);

angular.module('Service1', [])
  .service('XYZService', ['$http', function LmnoService($http) {

  } ]);

好的，我在montly控制器后面有控制器。控制器，我也需要把它们放在一个数组中吗？不，数组语法只是用于初始化一个控制器，它与其他控制器无关，你可能不想拆分成其他文件。为什么要冗余声明Module1？最好是在链中执行：
angular.module（'Module1'，[]）.controller（…）.controller（…）
，因为每个项目都返回模块。@Mik378我认为这是一个输入错误，第二个块应该声明Module2。@tuxedo25确实，这是可能的。是的，对不起，这是一个输入错误。我写了不同的声明，以便您可以在不同的文件中放置不同的控制器。
angular
    .module('Module1', [])
    .controller('AbcController', ['$scope', '$timeout', 'Service1', function ($scope, $timeout, service1) {} ]);

angular
    .module('Module2', [])
    .controller('EfgController', ['$scope', '$timeout', 'Service1', function ($scope, $timeout, service1) {} ]);

angular.module('Service1', [])
  .service('XYZService', ['$http', function LmnoService($http) {

  } ]);