Question

这篇文章基于this。

我的目的是基于文件分离组件。例如，我希望特定的控制器拥有它自己的文件（与服务，过滤器和指令相同）。当然，文件将根据它们将落入的模块组合在一起。以下是我目前所拥有的概述：

User/
    User/UserModule.js
    User/UserDirective.js
    User/UserService.js
    User/UserFilter.js
    User/UserController.js

UserModules.js

UserModule = angular.module('UserModule', []);

UserModule.controller('userCtrl', ['$scope', 'UserService', UserCtrl])

    .factory('userService', function() {
        return new UserService();
    })  

    .filter('userFilter', UserFilter)

    .directive('userDirective', UserDirective);

UserController.js

UserCtrl = function($scope, UserService) {
    // ...
};

UserDirective.js

UserDirective = function() {
    return {
        // ...
    }
};

UserService.js

UserService = function() {
    // ...
};

UserFilter.js

UserFilter = function() {
    return function() {
        // ...
    }
};

然后我将用户模块推送到app模块。

app.requires.push('UserModule');

我关心的是将概念（例如控制器，服务......）注册到模块。我想知道这是否是最好的方式，如果它是正确的。 parameters和外部js文件上也可能存在问题。

考虑这一部分：

.controller('userCtrl', ['$scope', 'UserService', UserCtrl])

上面的UserCtrl是指在单独的文件中定义的函数。我是否可以将$scope和UserService依赖项作为参数传递给UserCtrl？

UserCtrl = function($scope, UserService) { // Pass parameters (UserController.js)

在服务，过滤器和指令方面做到这一点的正确方法是什么？

最后，我该如何改进代码？

我也使用Meteor btw。

Answer 1

您不需要声明全局变量UserModule, UserDirective, UserService。您只需要声明/注册它们如下所示。 Angular将负责注入依赖项。

UserModule.js

angular.module('UserModule', []);

UserDirective.js

angular.module('UserModule').directive('userDirective', function() {
   return {
      // ...
   }
});

UserService.js

angular.module('UserModule').service('UserService', function() {

});

UserController.js

angular.module('UserModule').controller('UserController', ['$scope', 'UserService', function($scope, UserService){
}])

角度模块化文件结构

1 个答案: