AngularJS:工厂和服务?

Cam*_*all 213 javascript angularjs angularjs-service angularjs-factory

编辑2016年1月:由于这仍然备受关注.自从问这个我已经完成了一些AngularJS项目,并且对于那些我最常用的项目factory,构建了一个对象并在最后返回了对象.我下面的语句是仍然如此,但是.

编辑:我想,我终于明白了两者之间的主要区别,和我有一个代码示例演示.我也在想这个问题所提出的重复不同.重复的说,服务不是实例化,但如果你将其设置为我下面演示,它实际上是.服务可以被设置为是完全一样的工厂.我还将提供显示工厂故障服务的代码,这似乎没有其他答案.

如果我成立VaderService像这样(即服务):

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

module.service('VaderService', function() {
    this.speak = function (name) {
        return 'Join the dark side ' + name;
    }
});
Run Code Online (Sandbox Code Playgroud)

然后在我的控制,我可以这样做:

module.controller('StarWarsController', function($scope, VaderService) {
    $scope.luke = VaderService.speak('luke');   
});
Run Code Online (Sandbox Code Playgroud)

通过服务,注入到控制器的VaderService被实例化,所以我可以调用VaderService.speak,但是,如果我将VaderService更改为module.factory,控制器中的代码将不再起作用,这是主要区别.随着工厂,VaderService注入到控制器实例化,这就是为什么你需要设立一家工厂(见我的问题为例)返回一个对象.

但是,您可以设置在完全相同的方式服务,你可以建立一个工厂(IE有它返回一个对象)和服务的行为完全一样作为一个工厂

鉴于此信息,我认为没有理由使用工厂超过服务,服务可以做任何工厂可以做的更多.

下面原来的问题.


我知道这已经被问的时候加载,但我实在看不出工厂和服务之间的功能差异.我读过这个教程:http://blogs.clevertech.biz/startupblog/angularjs-factory-service-provider

它似乎给一个合理的很好的解释,但是,我设立了我的应用程序如下:

的index.html

<!DOCTYPE html>
<html>
    <head>
    <title>My App</title>
    <script src="lib/angular/angular.js"></script>
    <script type="text/javascript" src="js/controllers.js"></script>
    <script type="text/javascript" src="js/VaderService.js"></script>
    <script type="text/javascript" src="js/app.js"></script>
    </head>

    <body ng-app="MyApp"> 
        <table ng-controller="StarWarsController">
            <tbody>
            <tr><td>{{luke}}</td></tr>
            </tbody>
        </table>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

app.js:

angular.module('MyApp', [
  'MyApp.services',
  'MyApp.controllers'
]);
Run Code Online (Sandbox Code Playgroud)

controllers.js:

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

module.controller('StarWarsController', function($scope, VaderService) {
    var luke = new VaderService('luke');
    $scope.luke = luke.speak();
});
Run Code Online (Sandbox Code Playgroud)

VaderService.js

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

module.factory('VaderService', function() {
    var VaderClass = function(padawan) {
        this.name = padawan;
        this.speak = function () {
            return 'Join the dark side ' + this.name;
        }
    }

    return VaderClass;
});
Run Code Online (Sandbox Code Playgroud)

后来,当我加载index.html的我见"加入黑暗的一面卢克",太好了.完全符合预期.但是,如果我改变VaderService.js这个(注module.service而不是module.factory):

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

module.service('VaderService', function() {
    var VaderClass = function(padawan) {
        this.name = padawan;
        this.speak = function () {
            return 'Join the dark side ' + this.name;
        }
    }

    return VaderClass;
});
Run Code Online (Sandbox Code Playgroud)

然后重新装入index.html的(我确信我清空缓存并做了硬性重新加载).它的工作原理正是因为它与module.factory做了同样的.那两者之间真正的功能区别是什么?

Nid*_*nan 291

服务工厂


在此输入图像描述 在此输入图像描述

工厂和服务之间的差是一样的功能和物体之间的差

工厂提供商

  • 给我们的函数的返回值即.您只需创建一个对象,向其添加属性,然后返回相同的对象.当您将此服务传递到控制器时,该对象上的这些属性现在将通过您的工厂在该控制器中可用.(假设的情况)

  • 辛格尔顿,只会创建一次

  • 可重复使用的组件

  • Factory是在控制器之间进行通信(如共享数据)的绝佳方式.

  • 可以使用其他依赖

  • 通常使用时的服务实例需要复杂的创建逻辑

  • 不能注入.config()功能.

  • 用于不可配置的服务

  • 如果您正在使用对象,则可以使用工厂提供程序.

  • 句法: module.factory('factoryName', function);

服务提供者

  • 给了我们一个函数的实例(对象) - 你只需实例化与"新"的关键字,你会以"这个"添加属性和服务将返回"this'.When您通过服务为您的控制器,这些属性现在可以通过您的服务在该控制器上使用'this'.(假设的情况)

  • 辛格尔顿,只会创建一次

  • 可重复使用的组件

  • 服务被用于通信控制器共享数据之间

  • 您可以使用this关键字向服务对象添加属性和函数 

  • 依赖注入的构造函数的参数

  • 用于简单的创建逻辑

  • 不能注入.config()功能.

  • 如果您使用的是类,你可以使用服务提供商

  • 句法: module.service(‘serviceName’, function);

示例演示

在下面的例子中我定义MyServiceMyFactory.注意.service我是如何使用this.methodname.In 创建服务方法的..factory我已经创建了一个工厂对象并为其分配了方法.

AngularJS .service


module.service('MyService', function() {

    this.method1 = function() {
            //..method1 logic
        }

    this.method2 = function() {
            //..method2 logic
        }
});
Run Code Online (Sandbox Code Playgroud)

AngularJS .factory


module.factory('MyFactory', function() {

    var factory = {}; 

    factory.method1 = function() {
            //..method1 logic
        }

    factory.method2 = function() {
            //..method2 logic
        }

    return factory;
});
Run Code Online (Sandbox Code Playgroud)

也看看这个美丽的东西

感到困惑的服务VS工厂

AngularJS工厂,服务和供应商

Angular.js:服务vs提供商vs工厂?

  • 这对我来说很有意义!因此,我可以想象服务的行为就像工厂一样,但这与设计用于服务的服务有所不同.还有,如果我在使用module.factory时没有返回任何内容,那么事情将无法正常工作,对吗? (4认同)

Fiz*_*han 42

Factory并且Service是一个公正的包装provider.

Factory可以返回任何东西可以是class(constructor function),instance of class,string,numberboolean.如果返回一个constructor函数,则可以在控制器中实例化.

 myApp.factory('myFactory', function () {

  // any logic here..

  // Return any thing. Here it is object
  return {
    name: 'Joe'
  }
}
Run Code Online (Sandbox Code Playgroud)

服务

服务不需要任何回报.但你必须在this变量中分配所有内容.由于服务默认会创建实例并使用它作为一个基本对象.

myApp.service('myService', function () {

  // any logic here..

  this.name = 'Joe';
}
Run Code Online (Sandbox Code Playgroud)

该服务背后的实际angularjs代码

function service(name, constructor) {
    return factory(name, ['$injector', function($injector) {
        return $injector.instantiate(constructor);
    }]);
}
Run Code Online (Sandbox Code Playgroud)

它只是周围的包装factory.如果从返回的东西service,那么它会像Factory.

IMPORTANT:从工厂和服务的返回结果将是缓存,同样会为所有控制器返回.

当我要使用它们?

Factory在任何情况下大多较好.它可以当你有使用constructor功能,需要不同的控制器被实例化.

Service是一种Singleton对象.从服务对象的回报将是相同的所有控制器.它可以当你想为整个应用程序单独的对象中.例如:经过验证的用户详细信息

如需进一步了解,请阅读

http://iffycan.blogspot.in/2013/05/angular-service-or-factory.html

http://viralpatel.net/blogs/angularjs-service-factory-tutorial/

  • 那你为什么选择一个呢?你能给我一个工厂可以做的事情的一个坚实的例子吗?我仍然不明白其中的区别. (8认同)
  • 服务和工厂都是单身人士. (4认同)

Jay*_*ram 7

  • 如果您使用的服务,你会得到一个函数的实例("本"关键字).
  • 如果你使用一个工厂,您将获得由调用函数引用(在工厂return语句)的返回值

工厂和服务是最常用的食谱.它们之间唯一的区别是,服务工作的食谱为自定义类型的对象比较好,而工厂可以生产的JavaScript原语和功能.

参考

  • 我真的不明白这意味着什么.你能给我一个例子,说明你可以用工厂做但不用服务,或反过来吗? (4认同)