AngularJS的service

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

现在我们开始看怎么创建service

factory()

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

factory()让我们通过返回一个包含service方法和数据的对象来定义一个service。在service方法里面我们可以注入services,比如 $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()方法

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

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

什么时候使用factory()方法

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

注意:factory()定义的服务不能注入到.config()中 

service()

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

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

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

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

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

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

注意:什么时候适合使用service()定义的服务不能注入到.config()中 

provider()

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

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

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

angular.module('myApp') .config(function(UserProvider) ) 

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

angular.module('myApp') .controller('MainCtrl', function($scope, User) ); 

什么时候使用provider()方法

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

转载自http://my.oschina.net/tanweijie/blog/295067

版权及转载说明

本站原创、转载文章欢迎任何形式的转载,但请务必注明出处,尊重他人劳动共创开源社区

本站转载文章版权归原作者所有,如发现本站文章涉嫌侵权请点击「联系我们」反馈,本站将给予删除