将 angular 服务与 es6 模块一起使用有意义吗？

Question

当我们使用 ES6 模块时，使用 angular-services 有意义吗？例如，我们的代码中需要一个单例模块 (userService)，我们可以这样做：

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

app.service('userService', function(){
    this.users = ['John', 'James', 'Jake'];
});

app.controller('FooController', ['$scope', 'userService', function($scope, userService){

    console.log(userService);

}]);

但是我们可以在单独的文件中定义服务：

/* ./user-service.js */
export default users = ['John', 'James', 'Jake'];

，然后像这样编写代码：

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

var userService = require('./user-service')    

app.controller('FooController', ['$scope', function($scope){

    console.log(userService);

}]);

结果将与使用服务完全相同。那么，当我们可以使用模块时，为什么还要使用 angular 服务呢？

Answer 1

来源：Difference between service, directive and module =)

来自我自己的 personal notes（大部分来自文档、google 小组帖子和 SO 帖子）：

模块

提供一种方法来namespace/group服务、指令、过滤器、配置信息和初始化代码
帮助避免全局变量
用于配置 $injector，允许模块（或整个模块本身）定义的东西被注入到别处（依赖注入东西）
Angular 模块与 CommonJS 或 Require.js 无关。与 AMD 或 Require.js 模块相反，Angular 模块不会尝试解决脚本加载顺序或延迟脚本获取的问题。这些目标是正交的，两个模块系统可以并存并实现它们的目标（文档声称如此）。

服务

是单例，所以你定义的每个服务只有一个实例。作为单例，它们不受范围的影响，因此可以被多个 views/controllers/directives/other 服务访问（共享）
您可以（并且可能应该）创建自定义服务
- 两个或更多的东西需要访问相同的数据（不要使用根范围）或者你只是想整齐地封装你的数据
- 您想封装与网络服务器的交互（在您的服务中扩展 $resource 或 $http）
Built-in 服务以“$”开头。
要使用服务，需要在依赖项上进行依赖项注入（例如，在控制器、其他服务或指令上）。

指令（下面的一些项目基本上说的是同一件事，但我发现有时稍微不同的措辞会有很大帮助）

负责在模型状态改变时更新DOM
扩展 HTML 词汇量 = 教授 HTML 新技巧。
Angular 带有一组内置指令（例如，ng-* 东西），它们对于构建 Web 应用程序很有用，但您可以添加自己的指令，这样 HTML 就可以变成一种声明性领域特定语言（DSL）。例如，Angular 主页演示 "Creating Components" 中的
和
元素。
- Non-obvious built-in 指令（因为它们不以 "ng" 开头）：a、form、input、script、select、textarea。在Angular下，这些都做得比平时多！
指令允许您"componentize HTML"。指令通常优于 ng-include。例如，当您开始主要使用 data-binding 编写大量 HTML 时，将 HTML 重构为（可重用的）指令。
Angular 编译器允许您将行为附加到任何 HTML 元素或属性，甚至可以创建具有自定义行为的新 HTML 元素或属性。 Angular 将这些行为扩展称为指令。
- 归根结底，指令只是一个函数，当 Angular 编译器在 DOM.
指令是一种行为或 DOM 转换，由属性、元素名称、class 名称或注释中的名称的存在触发。指令是一种行为，当在 (HTML) 编译过程中遇到特定的 HTML 构造时，应该触发该行为。指令可以放在元素名称、属性、class 名称以及注释中。
- 大多数指令仅限于属性。例如，DoubleClick 仅使用自定义属性指令。
另见 What is an angularjs directive?

在模块中定义和分组 Angular 事物（依赖注入的东西）。
在服务中共享数据和包装 Web 服务器交互。
扩展 HTML 并在指令中进行 DOM 操作。
并使控制器尽可能"thin"。

Answer 2

是的！很有道理。

服务在您的应用程序中履行特定职责，在数据存储和视图之间移动数据。

模块允许您组织代码并分隔具有不同职责的部分。

通过将每个服务放入一个模块中，您可以更轻松地浏览和测试您的代码。很容易找到实现职责的所有代码。

将 angular 服务与 es6 模块一起使用有意义吗？

Does it make sense to use angular services with es6 modules?

javascript

angularjs

angular-services