AngularJS服务之 Factory vs Service vs Provider

AngularJS的service层用于处理业务逻辑和数据持久化，以下3钟方法可以创建并注册我们自己的service，在控制器中注入已创建的service服务，就可以调用service里面的属性和方法了。

1、Factory

2、Service

3、Provider

1、最简单的方式：Factory工厂方法

Angular里创建service最简单的方式就是使用factory()方法，使用factory()来创建服务的时候，首先创建一个对象，然后在这个对象上添加属性，最后返回这个对象。把这个服务注入控制器中，控制器就可以访问对象上的方法了。

angular.module('yeomanAngularApp').factory('playerFactory',function(){var _players = [{"username":"zhangsan",'address':'北京'},{"username":"lisi",'address':'上海'},{"username":"wangwu",'address':'大连'}];var service = {};service.getPlayers = function(){return _players;}return service;});

angular.module('yeomanAngularApp').controller('PlayerCtrl', function ($scope,$http,$filter,playerFactory) {$scope.playName = $filter('lowercase')('Angular');$scope.players = playerService.getPlayers();console.log(players);})

2、最直接的方式：Service构造函数方法

service()与factory用法差不多，区别在于不需要返回一个对象。

使用service()创建服务时，相当于使用new关键字进行了实例化，只需要在this上添加属性和方法，然后服务会自动返回this。把这个服务注入控制器中，控制器就可以访问对象上的属性方法了。

angular.module('yeomanAngularApp').service('playerService', function(){this.getRemotePlayers = function(){var deferred = $q.defer();  $http({  method: 'JSONP',  url: 'url'+'&callback=JSON_CALLBACK'  }).success(function(data, status) {  deferred.resove(data);  }).error(function(data, status) {  deferred.reject('error');  });  return deferred.promise;}})

angular.module('yeomanAngularApp').controller('PlayerCtrl', function ($scope,$http,$filter,playerService) {$scope.players = playerService.getRemotePlayers();console.log(players);})

3、最通用的方式：Provider方法

provider是唯一一种可以创建用来注入到config()函数的服务的方式。如果要在service对象启动之前先进行模块范围的配置，应使用Provider。

angular.module('yeomanAngularApp').provider('playerProvider',function(){this._players = [{"username":"zhangsan",'address':'北京'},{"username":"lisi",'address':'上海'},{"username":"wangwu",'address':'大连'}];this.paramFromConfig = '';this.$get = function(){var that = this;return{getPlayers: function(){return that._players;},paramOnConfig: that.paramFromConfig}}}).config(function(playerProviderProvider){playerProviderProvider.paramFromConfig = 'param from config';})

angular.module('yeomanAngularApp').controller('PlayerCtrl', function ($scope,$http,$filter,playerProvider) {$scope.playName = $filter('lowercase')('Angular');$scope.players = playerService.getPlayers();console.log(players);})