AngularJS:工厂和服务?

22 浏览
0 Comments

AngularJS:工厂和服务?

这个问题已经有答案了:

AngularJS:Service vs provider vs 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;
    }
});

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

module.controller('StarWarsController', function($scope, VaderService) {
    $scope.luke = VaderService.speak('luke');   
});

使用服务,注入到控制器中的VaderService是被实例化的,所以我可以直接调用VaderService.speak,但是,如果我将VaderService更改为module.factory,控制器中的代码将不再起作用,这就是主要区别。使用工厂,不能将VaderService注入到控制器中并实例化,这就是为什么在设置工厂时需要返回一个对象的原因(请参阅我在问题中的示例)。

然而,您可以以完全相同的方式设置服务,就像您可以设置工厂一样(即让它返回一个对象),服务的行为与工厂完全相同

有了这些信息,我看不到使用工厂而不是服务的理由,服务可以做工厂所能做的一切,甚至更多。

以下是原始问题。


我知道这个问题已经被问了很多次,但我真的看不出工厂和服务之间有什么功能上的区别。我阅读了这篇教程:http://blogs.clevertech.biz/startupblog/angularjs-factory-service-provider

看上去它提供了一个相当好的解释,然而,我设置了我的应用程序如下:

index.html


    
    
    
    

{{luke}}

 


app.js:

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

controllers.js:

var module = angular.module('MyApp.controllers', []);
module.controller('StarWarsController', function($scope, VaderService) {
    var luke = new VaderService('luke');
    $scope.luke = luke.speak();
});

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;
});

然后当我加载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;
});

然后重新加载index.html(我确保清空了缓存并进行了强制重新加载)。它的工作方式与module.factory完全相同。那么两者之间的真正功能区别是什么呢?

admin 更改状态以发布 2023年5月23日
0
0 Comments

FactoryService只是provider的包装器。

Factory

Factory可以返回任何可以是类(构造函数)类的实例字符串数字布尔值的东西。如果返回构造函数,你可以在控制器中实例化。

 myApp.factory('myFactory', function () {
  // any logic here..
  // Return any thing. Here it is object
  return {
    name: 'Joe'
  }
}

Service

服务无需返回任何东西。但你必须把所有东西分配给this变量。因为服务将默认创建实例并将其用作基础对象。

myApp.service('myService', function () {
  // any logic here..
  this.name = 'Joe';
}

服务背后的实际angularjs代码

function service(name, constructor) {
    return factory(name, ['$injector', function($injector) {
        return $injector.instantiate(constructor);
    }]);
}

它只是factory的包装器。如果你从service返回了东西,那么它将像Factory一样运行。

重要提示:从Factory和Service返回的结果将被缓存,并且对所有控制器返回相同的结果。

什么时候使用它们?

Factory在大多数情况下都是首选。它可用于需要在不同控制器中实例化的构造函数

Service是一种Singleton对象。从服务返回的对象将为所有控制器相同。当你想要在整个应用程序中拥有单个对象时,它可用于此。

进一步了解,请阅读

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

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

将上述内容翻译为:

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

0
0 Comments

ServiceFactory


enter image description here
enter image description here

工厂和服务之间的区别就像函数和对象之间的区别一样。

工厂提供程序

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

  • 单例,只会被创建一次

  • 可以重复使用的组件

  • 工厂是在控制器之间通信的良好方式,就像共享数据一样。

  • 可以使用其他依赖项

  • 通常用于服务实例需要复杂的创建逻辑的情况

  • 不能注入到.config()函数中。

  • 用于不可配置的服务

  • 如果您使用的是对象,可以使用工厂提供程序。

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

服务提供程序

  • 提供函数(对象)的实例-您只需使用“new”关键字实例化,然后将属性添加到“this”中,服务将返回“this”。当您将服务传递到控制器时,此“this”上的属性现在将通过该控制器在该控制器中可用。(假设场景)

  • 单例,只会被创建一次

  • 可重复使用的组件

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

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

  • 依赖项是作为构造函数参数注入的

  • 用于简单的创建逻辑

  • 不能注入到.config()函数中。

  • 如果您使用的是类,则可以使用服务提供程序。

  • 语法:module.service('serviceName',function);

示例演示

在下面的例子中,我定义了MyServiceMyFactory。请注意,在.service中,我使用this.methodname创建了服务方法。在.factory中,我创建了一个工厂对象并将方法分配给它。

AngularJS .service


module.service('MyService', function() {
    this.method1 = function() {
            //..method1 logic
        }
    this.method2 = function() {
            //..method2 logic
        }
});

AngularJS .factory


module.factory('MyFactory', function() {
    var factory = {}; 
    factory.method1 = function() {
            //..method1 logic
        }
    factory.method2 = function() {
            //..method2 logic
        }
    return factory;
});


也可以看一下这些有趣的内容:

关于service vs factory的疑惑

AngularJS Factory,Service和Provider

Angular.js:service vs provider vs factory?

0