Question

我有一个有两页的应用程序。

1 - 用户列表

2 - 我可以管理特定用户的地方

为了组织我在app.js文件中创建了两个独立的控制器和一个模块，并将所有内容放在一起（自定义过滤器，指令，工厂......）

现在我想用不同的文件（或者也许是文件夹）分隔。

我该怎么做？

angular.module('app', []).

controller('listController', function ($scope) {
    ... 
}).

controller('manageController', function ($scope) {
    ...
}).

factory('Api', ['$resource',
 function($resource) {
  return {
    ...
  };
}]).

filter('formtaData', function(){
   return function(data, modo){
       ...
   }
}).

其他问题是我的控制器具有不同的依赖关系，并且实际上我必须将它们全部包含在我的模块中（以及页面上的脚本），即使页面不需要它们。

Answer 1

appConfig.js

angular.module('app', [dep1, dep2]);

ListController.js

angular.module('app').controller('listController', function ($scope) {
    ... 
});

DetailsController.js

angular.module('app').controller('manageController', function ($scope) {
    ...
});

apiService.js

angular.module('app').factory('Api', ['$resource',
 function($resource) {
  return {
    ...
  };
}]);

formatDataFilter.js

angular.module('app').filter('formtaData', function(){
   return function(data, modo){
       ...
   }
});

Answer 2

你可以这样做

templates/
    _login.html
    _list.html
    _manage.html
app/
    app.js
    controllers/
        ListController.js
        ManageController.js
    directives/
        SomeDirective.js
    services/
        ApiService.js
        AnotherService.js
    filters/
        FormtaDataFilter.js

在 app.js 中，你可以这样写：

app.config(function($routeProvider){
    $routeProvider
    .when('/list', {
        controller: 'ListController',
        templateUrl: 'templates/_list.html'
    })
    .when('/manage', {
        controller: 'ManageController.js',
        templateUrl: 'templates/_manage.html'
    })
    .otherwise({redirectTo: '/'});
});

Answer 3

上面的答案是正确的，但我通常会将角度模块分配给文字，以避免每次都输入全名。

InputBox

AngularJS - 如何分离控制器/模块？

3 个答案: