Question

我发现this post关于构造角度应用程序，它真的很棒。我正计划根据前面提到的构建我的角度应用程序。现在，如果我们尝试查看帖子上的代码：

var userModule = angular.module('userModule',[]);

userModule.factory('userService', ['$http', function($http) {
  return new UserService($http);
}]);

userModule.factory('userModel', ['userService', function(userService) {
  return new UserModel(userService);
}]);

userModule.controller('loginController', ['$scope', 'userModel', LoginController]);

userModule.controller('registrationController', ['$scope', 'userModel', RegistrationController]);

我想知道LoginController代码会是什么样子？同样基于帖子，您将创建一个LoginModule.js文件，并将其放在相关的js文件中。现在的问题是：LoginController.js文件是自动包含还是某个地方会有配置或代码要求？

此查询不仅限于控制器，也许还有使用服务，过滤器和指令的方法。你觉得怎么样？

Answer 1

根据文章的结构，这是我构建我的角度应用程序的方式。

在这种情况下，我们有四个主要模块（文件夹）：cart，common，product和user。每个主文件夹都可以有模块，控制器，服务，指令等的子文件夹。我将重点关注产品文件夹。

|-- product/
|   |-- modules/
|   |   |--  Product.js
|   |   |--  Search.js
|   |-- controllers/    
|   |   |-- search/
|   |   |   |-- SearchResultsController.js
|   |   |-- product/
|   |   |   |-- ProductDetailController.js
|   |-- services/
|   |   |-- search/
|   |   |   |-- SearchResultsModel.js
|   |   |-- product/
|   |   |   |-- ProductModel.js
|   |   |   |-- ProductService.js
|   |-- directives/
|   |   |   |-- ProductDirective.js
|   |   |   |-- OtherDirective.js

每个主文件夹必须有主angularJS模块，在那里注册其他东西。如果是产品，则为product/modules/Product.js然后可以包含此模块以使用应用程序中的整个结构。

在产品的主模块中，您可以为子文件夹（如控制器，服务，指令等）注册其他子模块。如果是产品模块，则有product.controllers，product.services和product.directives子模块。它还注册了搜索模块，搜索模块可以拥有自己的搜索控制器子模块，指令......以便更好地分离。主product模块的代码如下所示：

angular.module('product.controllers', []);
angular.module('product.services', []);
angular.module('product.directives', []);

angular.module('product', ['product.controllers', 'product.services', 'product.directives', 'search'])
    .config(['$routeProvider', function($routeProvider){

    ...

}]);

在控制器，指令等的子模块上，您可以注册应用程序的其他内容。 ProductService.js例如如下所示：

angular.module('product.services').factory('productSerivice', [function(){

    ...

}]);

SearchResultsController.js migth看起来像这样：

angular.module('search.controllers').controller('SearchResultsController', ['$scope', 
    function($scope){

    ...

}]);

这允许您将每个实体（无论是控制器，服务还是指令）放在单独的文件中，而不会污染全局范围。它也是分离和结构化的模块，可以很容易地从整个应用程序中添加或删除。

Angular js模块化方法控制器结构

1 个答案: