了解AngularJS工厂、服务和提供商

所有这些都用于共享可重用的单例对象。它有助于在应用程序/各种组件/模块之间共享可重用代码。

来自文档服务/工厂：延迟实例化–Angular仅在应用程序组件依赖于服务/工厂时实例化它。单件–每个组件依赖于服务获取对单个实例的引用由服务工厂生成。

工厂

工厂是一个函数，您可以在创建对象之前操作/添加逻辑，然后返回新创建的对象。

app.factory('MyFactory', function() {
    var serviceObj = {};
    //creating an object with methods/functions or variables
    serviceObj.myFunction = function() {
        //TO DO:
    };
    //return that object
    return serviceObj;
});

用法

它可以只是像类一样的函数集合。因此，当您将其注入控制器/工厂/指令函数时，它可以在不同的控制器中实例化。每个应用程序只实例化一次。

服务

在查看服务时，只需考虑阵列原型。服务是一个使用“new”关键字实例化新对象的函数。您可以使用this关键字将财产和函数添加到服务对象。与工厂不同，它不返回任何内容（它返回包含方法/财产的对象）。

app.service('MyService', function() {
    //directly binding events to this context
    this.myServiceFunction = function() {
        //TO DO:
    };
});

用法

当您需要在整个应用程序中共享单个对象时，请使用它。例如，经过验证的用户详细信息、可共享的方法/数据、实用程序功能等。

供应商

提供程序用于创建可配置的服务对象。您可以通过config函数配置服务设置。它使用$get（）函数返回一个值。$get函数在运行阶段以角度执行。

app.provider('configurableService', function() {
    var name = '';
    //this method can be be available at configuration time inside app.config.
    this.setName = function(newName) {
        name = newName;
    };
    this.$get = function() {
        var getName = function() {
             return name;
        };
        return {
            getName: getName //exposed object to where it gets injected.
        };
    };
});

用法

当您需要在服务对象可用之前为其提供模块化配置时，例如，假设您希望根据环境（如dev、stage或prod）设置API URL

注释只有提供程序在angular的配置阶段可用，而服务和工厂不是。

希望这能澄清您对工厂、服务和供应商的理解。

看完所有这些帖子后，这给我带来了更多的困惑……但所有的信息都是有价值的。。最后我找到了下表，它将通过简单的比较提供信息

注射器使用配方创建两种类型的对象：服务和特殊用途物体有五种配方类型定义了如何创建对象：Value，工厂、服务、供应商和常量。工厂和服务是最常用的配方。它们之间的唯一区别是，Service配方对自定义类型的对象更有效，而Factory可以生成JavaScript原语和函数。提供者配方是核心配方类型，所有其他配方都只是其语法上的糖。提供程序是最复杂的配方类型。除非您正在构建一段需要全局配置的可重用代码，否则您不需要它。除控制器外的所有特殊用途对象均通过工厂配方定义。

对于初学者来说：-这可能不正确的用例，但在高级别上，这是这三个用例的用例。

如果要在angular模块中使用，应将配置函数创建为提供程序

angular.module（'myApp'）.config（函数（$testProvider）{$testProvider.someFunction（）；})

Ajax调用或第三方集成需要提供服务。对于数据操作，将其创建为工厂

对于基本场景，工厂和服务的行为相同。

1.服务是在必要时创建的单例对象，在应用程序生命周期结束之前（浏览器关闭时）不会被清理。控制器在不再需要时被销毁和清理。

2.创建服务的最简单方法是使用factory（）方法。factory（）方法允许我们通过返回包含服务函数和服务数据的对象来定义服务。服务定义函数是我们放置可注入服务的地方，例如$http和$q。前任：

angular.module('myApp.services')
.factory('User', function($http) { // injectables go here
var backendUrl = "http://localhost:3000"; var service = {
    // our factory definition
user: {},
setName: function(newName) {
      service.user['name'] = newName;
    },
setEmail: function(newEmail) { service.user['email'] = newEmail;
},
save: function() {
return $http.post(backendUrl + '/users', { user: service.user
}); }
};
return service; });

在我们的应用程序中使用factory（）

在我们的应用程序中使用工厂很容易，因为我们可以在运行时在需要的地方简单地注入工厂。

angular.module('myApp')
.controller('MainController', function($scope, User) {
  $scope.saveUser = User.save;
});

另一方面，service（）方法允许我们通过定义构造函数来创建服务。我们可以使用原型对象来定义服务，而不是原始javascript对象。与factory（）方法类似，我们还将在函数定义中设置可注入项。创建服务的最低级方法是使用provide（）方法。这是创建可以使用.config（）函数配置的服务的唯一方法。与前面的to方法不同，我们将在定义的this中设置可注射对象$get（）函数定义。

了解AngularJS工厂、服务和提供商

所有这些都用于共享可重用的单例对象。它有助于在应用程序/各种组件/模块之间共享可重用代码。

来自文档服务/工厂：延迟实例化–Angular仅在应用程序组件依赖于服务/工厂时实例化它。单件–每个组件依赖于服务获取对单个实例的引用由服务工厂生成。

工厂

工厂是一个函数，您可以在创建对象之前操作/添加逻辑，然后返回新创建的对象。

app.factory('MyFactory', function() {
    var serviceObj = {};
    //creating an object with methods/functions or variables
    serviceObj.myFunction = function() {
        //TO DO:
    };
    //return that object
    return serviceObj;
});

用法

它可以只是像类一样的函数集合。因此，当您将其注入控制器/工厂/指令函数时，它可以在不同的控制器中实例化。每个应用程序只实例化一次。

服务

在查看服务时，只需考虑阵列原型。服务是一个使用“new”关键字实例化新对象的函数。您可以使用this关键字将财产和函数添加到服务对象。与工厂不同，它不返回任何内容（它返回包含方法/财产的对象）。

app.service('MyService', function() {
    //directly binding events to this context
    this.myServiceFunction = function() {
        //TO DO:
    };
});

用法

当您需要在整个应用程序中共享单个对象时，请使用它。例如，经过验证的用户详细信息、可共享的方法/数据、实用程序功能等。

供应商

提供程序用于创建可配置的服务对象。您可以通过config函数配置服务设置。它使用$get（）函数返回一个值。$get函数在运行阶段以角度执行。

app.provider('configurableService', function() {
    var name = '';
    //this method can be be available at configuration time inside app.config.
    this.setName = function(newName) {
        name = newName;
    };
    this.$get = function() {
        var getName = function() {
             return name;
        };
        return {
            getName: getName //exposed object to where it gets injected.
        };
    };
});

用法

当您需要在服务对象可用之前为其提供模块化配置时，例如，假设您希望根据环境（如dev、stage或prod）设置API URL

注释只有提供程序在angular的配置阶段可用，而服务和工厂不是。

希望这能澄清您对工厂、服务和供应商的理解。

正如这里的几个人正确指出的，工厂、供应商、服务，甚至价值和常量都是同一事物的版本。您可以将更通用的提供程序分解为所有这些提供程序。像这样：

这是本文的图片来源：

http://www.simplygoodcode.com/2015/11/the-difference-between-service-provider-and-factory-in-angularjs/

我注意到了一些有趣的事情，当我和提供者一起玩的时候。

与服务和工厂相比，供应商对注射剂的可见性有所不同。如果您声明AngularJS“常量”（例如，myApp.constant（'a'，'Robert'）；），您可以将其注入服务、工厂和提供商。

但是如果您声明一个AngularJS“value”（例如，myApp.value（'b'，{name:'Jones‘}）；），您可以将其注入服务和工厂，但不能注入提供程序创建函数。但是，您可以将其注入为提供者定义的$get函数中。AngularJS文档中提到了这一点，但很容易错过。您可以在%provide页面的value和constant方法部分找到它。

http://jsfiddle.net/R2Frv/1/

<div ng-app="MyAppName">
    <div ng-controller="MyCtrl">
        <p>from Service: {{servGreet}}</p>
        <p>from Provider: {{provGreet}}</p>
    </div>
</div>
<script>
    var myApp = angular.module('MyAppName', []);

    myApp.constant('a', 'Robert');
    myApp.value('b', {name: 'Jones'});

    myApp.service('greetService', function(a,b) {
        this.greeter = 'Hi there, ' + a + ' ' + b.name;
    });

    myApp.provider('greetProvider', function(a) {
        this.firstName = a;
        this.$get = function(b) {
            this.lastName = b.name;
            this.fullName = this.firstName + ' ' + this.lastName;
            return this;
        };
    });

    function MyCtrl($scope, greetService, greetProvider) {
        $scope.servGreet = greetService.greeter;
        $scope.provGreet = greetProvider.fullName;
    }
</script>