AngularJS中的代码分离

Question

我对AngularJS很陌生，所以请在阅读这个问题时牢记这一点......

我有一些功能，我想让我的网站中的不同模块全局可用，计划是让页面以单页面应用程序样式执行自己的功能（因此用户列表/创建/修改将是一页，产品清单/创建/修改将是另一个）。我希望有一些共享逻辑，比如效用函数，以及可以在不同页面模块之间共享的用户授权。

这引出了我的问题。

假设我已将所有帐户功能封装在服务（app.factory（＆＃39;帐户等等等）中），并将其分成自己的JS文件，最好将它放在它自己的模块中并使用依赖注入：

var accountMod = angular.module('accountModule', ['dependencies']);
accountMod.factory('account', ['dependencies', function (...) { }]);

或者只是假设app变量的名称将始终是app并且表达如下：

app.factory('account', ['dependencies', function (...) { }]);

功能上这两个都有效，但我正在尝试使用最佳实践。第二种选择看起来有限，我从来都不热衷于假设变量是同一个名字，对我来说，依赖注入方法似乎更好但我已经看到了很多这两种样式的例子！

非常感谢任何帮助！

Answer 1

非常好的问题。这里有微妙的东西。 我认为使用以下代码是有帮助的，即使用模块。

var accountMod = angular.module('accountModule', ['dependencies']);
accountMod.factory('account', ['dependencies', function (...) { }]);

1. 但是在角度提供程序和添加模块级别配置的帮助下，我们可以模拟对象或服务。最终这将增加代码的测试能力。
2. 如果会计中有多个服务，那么我更愿意将它们分组到模块中。

这是我看待它的方面。如果找到，请添加更多。

感谢。

Answer 2

您的代码示例只需2美分。 建议不要使用以下方法：

var accountMod = angular.module('accountModule', ['dependencies']);
accountMod.factory('account', ['dependencies', function (...) { }]);

最佳做法是每个文件只有1个组件，因此无需定义变量。看看这个：https://github.com/johnpapa/angular-styleguide#definitions-aka-setters

如果您刚刚开始使用Angular，我建议您浏览 John Papa的风格指南的其余部分。

Answer 3

我喜欢自耕农的角度全栈发生器所具有的结构。

https://github.com/DaftMonk/generator-angular-fullstack

您可以看到每个模块和组件是如何分开的，内部，工厂，服务，指令等，并且它们的关联测试按功能分成一个文件。

这可能对你的建议有些过分，你只能采取有棱有角的想法。