AngularJS中service,factory,provider的区别(转载:http://my.oschina.net/tanweijie/blog/295067)

目录[-]

一、service引导

刚开始学习Angular的时候,经常被误解和被初学者问到的组件是 service(), factory(), 和 provide()这几个方法之间的差别。This is where we‘ll start the twenty-five days of Angular calendar.

二、service

在Angular里面,services作为单例对象在需要到的时候被创建,只有在应用生命周期结束的时候(关闭浏览器)才会被清除。而controllers在不需要的时候就会被销毁了。

这就是为什么使用controllers在应用里面传递数据不可靠的原因,特别是使用routing的时候。Services are designed to be the glue between controllers, the minions of data, the slaves of functionality, the worker-bees of our application(就是说services在应用的controllers、 方法、数据之前起到了很关键的作用)

现在我们开始看怎么创建service。每个方法我们都会看到下面两个一样的参数:

  • name-我们要定义的service的名字
  • function-service方法

他们都创建了相同的底层对象类型。实例化后,他们都创建了一个service,这些对象没有什么功能上的差别。

1、factory()

Angular里面创建service最简单的方式是使用factory()方法。

factory()让我们通过返回一个包含service方法和数据的对象来定义一个service。在service方法里面我们可以注入services,比如 $http 和 $q等。

?


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

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()方法

在应用里面可以很容易地使用factory ,需要到的时候简单地注入就可以了

?


1

2

3

4

angular.module(‘myApp‘)

.controller(‘MainCtrl‘function($scope, User) {

  $scope.saveUser = User.save;

});

  • 什么时候使用factory()方法

在service里面当我们仅仅需要的是一个方法和数据的集合且不需要处理复杂的逻辑的时候,factory()是一个非常不错的选择。

注意:需要使用.config()来配置service的时候不能使用factory()方法

2、service()

service()通过构造函数的方式让我们创建service,我们可以使用原型模式替代javaScript原始的对象来定义service。

和factory()方法一样我们也可以在函数的定义里面看到服务的注入

?


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

angular.module(‘myApp.services‘)

.service(‘User‘function($http) { // injectables go here

  var self = this// Save reference

  this.user = {};

  this.backendUrl = "http://localhost:3000";

  this.setName = function(newName) {

    self.user[‘name‘] = newName;

  }

  this.setEmail = function(newEmail) {

    self.user[‘email‘] = newEmail;

  }

  this.save = function() {

    return $http.post(self.backendUrl + ‘/users‘, {

      user: self.user

    })

  }

});

这里的功能和使用factory()方法的方式一样,service()方法会持有构造函数创建的对象。

  • 在应用里面使用service()方法

?


1

2

3

4

angular.module(‘myApp‘)

.controller(‘MainCtrl‘function($scope, User) {

  $scope.saveUser = User.save;

});

  • 什么时候适合使用service()方法

service()方法很适合使用在功能控制比较多的service里面

注意:需要使用.config()来配置service的时候不能使用service()方法

3、provider()

provider()是创建service最底层的方式,这也是唯一一个可以使用.config()方法配置创建service的方法

不像上面提到的方法那样,我们在定义的this.$get()方法里面进行依赖注入

?


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

angular.module(‘myApp.services‘)

.provider(‘User‘function() {

  this.backendUrl = "http://localhost:3000";

  this.setBackendUrl = function(newUrl) {

    if (url) this.backendUrl = newUrl;

  }

  this.$get = function($http) { // injectables go here

    var self = this;

    var service = {

      user: {},

      setName: function(newName) {

        service.user[‘name‘] = newName;

      },

      setEmail: function(newEmail) {

        service.user[‘email‘] = newEmail;

      },

      save: function() {

        return $http.post(self.backendUrl + ‘/users‘, {

          user: service.user

        })

      }

    };

    return service;

  }

});

  • 在应用里面使用provider()方法

为了给service进行配置,我们可以将provider注入到.config()方法里面

?


1

2

3

4

angular.module(‘myApp‘)

.config(function(UserProvider) {

  UserProvider.setBackendUrl("http://myApiBackend.com/api");

})

这样我们就可以和其他方式一样在应用里面使用这个service了

?


1

2

3

4

angular.module(‘myApp‘)

.controller(‘MainCtrl‘function($scope, User) {

  $scope.saveUser = User.save;

});

  • 什么时候使用provider()方法
  1. 当我们希望在应用开始前对service进行配置的时候就需要使用到provider()。比如,我们需要配置services在不同的部署环境里面(开发,演示,生产)使用不同的后端处理的时候就可以使用到了
  2. 当我们打算发布开源provider()也是首选创建service的方法,这样就可以使用配置的方式来配置services而不是将配置数据硬编码写到代码里面。

还可以看看这篇翻译:http://www.oschina.net/translate/top-10-mistakes-angularjs-developers-make

点击查看完整的代码:https://gist.github.com/auser/7743235

时间: 2024-08-09 02:20:27

AngularJS中service,factory,provider的区别(转载:http://my.oschina.net/tanweijie/blog/295067)的相关文章

Angularjs1.x 中的 service,factory,provider,constant,value

了解 Angularjs1.x 中的 service,factory,provider,constant,value 的应用场景及区别 不管 service , factory 还是 provider 都属于 service 关于 service service 一旦被定义后就可以在任何地方通过依赖的方式调用且可以保存数据,直到应用结束,比如 controller(['service', function(service){}]); 而 controller 则一旦路由发生变化 controll

AngularJS进阶(三十三)书海拾贝之简介AngularJS中使用factory和service的方法

简介AngularJS中使用factory和service的方法 AngularJS支持使用服务的体系结构"关注点分离"的概念.服务是JavaScript函数,并负责只做一个特定的任务.这也使得他们成为维护和测试的单独实体.控制器,过滤器可以调用它们作为需求的基础.服务使用AngularJS的依赖注入机制注入正常. AngularJS提供例如许多内在的服务,如:$http, $route, $window, $location等.每个服务负责例如一个特定的任务,$http是用来创建AJ

angularjs---服务(service / factory / provider)

初angularJs时  常写一些不够优雅的代码  !我总结了一下看看各位有没有中枪的!-----( 这里只针对服务service及其相关! ) 以下做法不太优雅 兄弟controller 之间的相同的业务逻辑的实现 靠  从父 controller 通过继承实现.   × 将大量的不必要的业务逻辑和持久化的数据  堆放在 $scope  和controller中.    × ...... 其实我们应该把业务逻辑和持久化的数据尽量放在service中 从内存性能的角度来看,只有在需要contro

c#中 ==与equals有什么区别(转载)

c#中 ==与equals有什么区别 对于值类型.引用类型来说比较过程怎样的? using System;using System.Collections.Generic;using System.Text; namespace ConsoleApplication1{    class Person    {        private string name; public string Name        {            get { return name; }      

AngularJS中service,factory,provider的区别

1.factory() Angular里面创建service最简单的方式是使用factory()方法. factory()让我们通过返回一个包含service方法和数据的对象来定义一个service.在service方法里面我们可以注入services,比如 $http 和 $q等. 在service里面当我们仅仅需要的是一个方法和数据的集合且不需要处理复杂的逻辑的时候,factory()是一个非常不错的选择. 注意:需要使用.config()来配置service的时候不能使用factory()

angularjs model.service vs provider vs factory?

<!DOCTYPE html> <html ng-app="app"> <head> <script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.0.1/angular.min.js"></script> <meta charset=utf-8 /> <title>JS Bin</title> </

angular 服务 service factory provider constant value

angular服务 服务是对公共代码的抽象,由于依赖注入的要求,服务都是单例的,这样我们才能到处注入它们,而不用去管理它们的生命周期. angular的服务有以下几种类型: 常量(Constant): 用于声明不会被修改的值. 变量(Value): 用于声明会被修改的值. 服务(Service): 这个名称跟服务这个大概念同名,就种行为就像是给自己孩子取名为"孩子".只需要创建这个服务,然后等angular把它new出来,保存这个服务,然后就可以到处注入了. 工厂(Factory): 

angluar 区分service/factory/provider 的“hello world”版

var myApp = angular.module("myApp",[]); // controller 中引用 provider factory service 的时候,不需要添加后缀... myApp.controller("myController",function($scope,my,myFactory,myService){     $scope.hellos = [         my.sayHello(),         myFactory.s

关于android编程中service和activity的区别

一. 绝大部分情况下,Service的作用是用来"执行"后台的.耗时的.重要的任务,三者缺一不可,而最重要的原因是第三点:要执行重要的任务. 因为当一个进程启动了Service后,进程的优先级变高了,系统除非在非常极端的情况下,不会杀掉该进程,反观Activity,不具备这样的特性. 如果没有满足上面所说的三点,请谨慎使用Service,千万别把使用Service的理由变成:这样可以常驻后台.从资源使用的角度来看,这是非常不可取的. 二. 1.Activity和Service的生命周期