AngularJS为模块声明的最佳实践？ [英] AngularJS best practices for module declaration?
问题描述
我有一堆我的应用程序中声明角模块。我最初开始使用链式语法像这样声明它们：
I have a bunch of Angular modules declared in my app. I originally started declaring them using the "chained" syntax like this:
angular.module('mymodule', [])
.controller('myctrl', ['dep1', function(dep1){ ... }])
.service('myservice', ['dep2', function(dep2){ ... }])
... // more here
但我还是决定，这不是很容易阅读，所以我就开始宣称他们使用一个模块变量：
But I decided that wasn't very easy to read, so I started declaring them using a module variable like this:
var mod = angular.module('mymodule', []);
mod.controller('myctrl', ['dep1', function(dep1){ ... }]);
mod.service('myservice', ['dep2', function(dep2){ ... }]);
...
第二个语法似乎有很多更易读给我，但我唯一的抱怨是，这个语法离开 MOD 变量出在全球范围内。如果我有一个名为其他一些变量 MOD ，它将与（与全局变量相关等问题），这下一个被重写。
The second syntax seems a lot more readable to me, but my only complaint is that this syntax leaves the mod variable out in the global scope. If I ever have some other variable named mod, it would be overridden with this next one (and other issues associated with global variables).
所以我的问题是，这是最好的办法吗？或者会是更好的做这样的事情：
So my question is, is this the best way? Or would it be better to do something like this?:
(function(){
var mod = angular.module('mymod', []);
mod.controller('myctrl', ['dep1', function(dep1){ ... }]);
mod.service('myservice', ['dep2', function(dep2){ ... }]);
...
})();
还是它甚至事够照顾？只是想知道什么是最佳做法是模块声明。先谢谢了。
Or does it even matter enough to care? Just curious to know what the "best practices" are for module declaration. Thanks in advance.
推荐答案
最佳的方式来声明一个模块
由于角是全球范围内本身和模块保存到它的变量，你可以通过 angular.module访问模块（'mymod'）：
As angular is on the global scope itself and modules are saved to its variable you can access modules via angular.module('mymod'):
// one file
// NOTE: the immediately invoked function expression
// is used to exemplify different files and is not required
(function(){
// declaring the module in one file / anonymous function
// (only pass a second parameter THIS ONE TIME as a redecleration creates bugs
// which are very hard to dedect)
angular.module('mymod', []);
})();
// another file and/or another anonymous function
(function(){
// using the function form of use-strict...
"use strict";
// accessing the module in another.
// this can be done by calling angular.module without the []-brackets
angular.module('mymod')
.controller('myctrl', ['dep1', function(dep1){
//..
}])
// appending another service/controller/filter etc to the same module-call inside the same file
.service('myservice', ['dep2', function(dep2){
//...
}]);
// you can of course use angular.module('mymod') here as well
angular.module('mymod').controller('anothermyctrl', ['dep1', function(dep1){
//..
}])
})();
没有其他的全局变量是必需的。
No other global variables are required.
当然这取决于所有的preferences，但我觉得这是一种最好的做法，因为
Of course it depends all on preferences, but I think this is kind of the best practise, as
- 您不必污染全局范围内
- 您可以随时随地访问自己的模块或随意它们和它们的功能归类到不同的文件
- 您可以使用使用严格的函数形式;
- 文件的加载顺序并不重要，多
选项进行排序的模块和文件
声明和访问模块的这种方式，会让你很灵活。您可以通过排序功能型（如在另一个答案所述）或通过路径，例如模块：
This way of declaring and accessing modules makes you very flexible. You can sort modules via function-type (like described in another answer) or via route, e.g.:
/******** sorting by route **********/
angular.module('home')...
angular.module('another-route')...
angular.module('shared')...
您到底如何排序是个人口味，规模和项目类型的问题。我个人比较喜欢组相同的文件夹（命令进入指令，控制器，服务和过滤器的子文件夹）的内部模块的所有文件，包括所有不同的测试文件，因为它使你的模块的更多重用。因此，在中等规模的项目，我结束了一个基础模块，它包括所有的基本路线和自己的控制器，服务指令和或多或少复杂的子模块，当我想他们可能是为其他项目也是有用的，例如：
How you sort it in the end is a matter of personal taste and the scale and type of the project. I personally like to group all files of a module inside of the same folder (ordered into sub-folders of directives, controllers, services and filters), including all different test-files, as it makes your modules more reusable. Thus in middle-sized projects I end up with a base-module, which includes all basic routes and their controllers, services, directives and more or less complex sub-modules, when I think they could be useful for other projects as well,e.g.:
/******** modularizing feature-sets **********/
/controllers
/directives
/filters
/services
/my-map-sub-module
/my-map-sub-module/controllers
/my-map-sub-module/services
app.js
...
angular.module('app', [
'app.directives',
'app.filters',
'app.controllers',
'app.services',
'myMapSubModule'
]);
angular.module('myMapSubModule',[
'myMapSubModule.controllers',
'myMapSubModule.services',
// only if they are specific to the module
'myMapSubModule.directives',
'myMapSubModule.filters'
]);
有关非常大的项目，我有时也最终被分组的路由模块，上面或某些选定的主要航线或路线和一些选定的组件，甚至组合的描述，但它实际上取决于
For very big projects, I sometimes end up grouping modules by routes, as described above or by some selected main routes or a even a combination of routes and some selected components, but it really depends.
编辑：
正因为它是有关，我跑成最近一次：以你（通过添加第二个参数来angular.module功能）创建一个模块只有一次照顾好。这会搞乱你的应用程序，可以是防不胜防。
Just because it is related and I ran into that very recently again: Take good care that you create a module only once (by adding a second parameter to the angular.module-function). This will mess up your application and can be very hard to detect.
2015年编辑整理上的模块：
One和角体验半年后，我可以添加使用你的应用程序中的命名不同模块的好处是为AMD仍然没有真正与角和服务工作，以及比较有限，指令和过滤器是角内全球可用反正背景下（<一个href=\"http://stackoverflow.com/questions/30374934/angularjs-module-dependencies-naming-clash/30376123#30376123\">as这里为例）。还有一个语义和结构的好处，虽然它可能是有帮助的，能够包含/排除的模块与code单行或缩小评论说。
2015 EDIT on sorting modules: One and a half year of angular-experience later, I can add that the benefits from using differently named modules within your app are somewhat limited as AMD still does not really work well with Angular and services, directives and filters are globally available inside the angular context anyway (as exemplified here). There is still a semantic and structural benefit though and it might be helpful being able to include/ exclude a module with a single line of code commented in or out.
这还差不多的从不多大意义按类型来分隔子模块（如myMapSubModule.controllers'），因为他们通常依赖于对方。
It also almost never makes much sense to separate sub-modules by type (eg. 'myMapSubModule.controllers') as they usually depend on each other.
这篇关于AngularJS为模块声明的最佳实践？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
