在AngularJS中,我们经常将通用的业务逻辑封装在服务里面,这样一来,不仅减少了代码量,而且使出错率也降低了,代码的易读性也提高了,所以说,我们经常用到了业务逻辑,或者是说持久化数据化操作应该放在自定义的服务里面,而不是Controller里面。下面我说一下provider、service、factory的定义方式还有主要区别。
1、provider
Providers是唯一 一种你可以传进 .config() 函数的service。当你想要在 service对象启用之前,先进行模块范围的配置,那就应该用 provider。当我们定义provider时候,我们还必须将返回对象放在this.$get=function(){}中。代码如下:
var myModule = angular.module("HelloAngular", []);
myModule.config(['providerServiceProvider',function(providerServiceProvider){
providerServiceProvider.name='这是通过外部config传入的参数名字:大哥你好啊!!!!!!';
}])
myModule.provider('providerService',function(){
this.name='';
this.$get=function(){
var _name='';
var serverce={};
var that =this;
serverce.setName=function(name){
_name=name;
}
serverce.getName=function(){
return _name;
}
serverce.getConfigName=function(){
return that.name;
}
return serverce;
}
});
定义个Controller调用该服务
myModule.controller("helloAngular", ['$scope','service01','factory01','providerService',
function HelloAngular($scope,service01,factory01,providerService) {
providerService.setName("这是providerService服务设置的名字:美女,今晚约吗?");
console.log(providerService.getName());
console.log(providerService.getConfigName());
}
]);
效果图:
2、service
Service是用"new"关键字实例化的。因此,你应该给"this"添加属性, 然后service返回"this"。你把 service 传进 controller 之后,在 controller 里 "this" 上的属性就可以通过 service来使用了。
myModule.service('service01',function(){
var _name='';
this.setName=function(name){
_name=name;
}
this.getName=function(){
return _name;
};
});
Controller可以这么写
myModule.controller("helloAngular", ['$scope','service01',
function HelloAngular($scope,service01) {
service01.setName("这是service01服务设置的名字:美女,今晚约吗?");
console.log(service01.getName());
}
]);
3、factory
factory 方法直接把一个函数当成一个对象的$get 方法,它还可以直接返回字符串,用factory 就是创建一个对象,为它添加属性,然后把这个对象返回出来。你把service 传进 controller 之后,在controller 里这个对象里的属性就可以通过factory 使用了。代码如下:
factory直接返回字符串,其它的两个服务不行。
myModule.factory('factory01',function(){
return '你大爷的';
});
factory定义对象,然后在对象上定义各种属性,各种方法。
myModule.factory('factory01',function(){
var _name='';
var serverce={};
var that =this;
serverce.setName=function(name){
_name=name;
}
serverce.getName=function(){
return _name;
}
serverce.getConfigName=function(){
return that.name;
}
return serverce;
});
Controller的调用我就不用再写了吧,和上面一样,相比较三种方式,定义服务的方法大同小异,只是provider方法稍微复杂了点。
service方法与factory相比,service可以不用生命对象,它直接将某些属性和方法绑定在this上就可以,但是它不可以直接返回字符串,而factory定义的服务必须在里面定义一个对象,将某些公用的方法或者属性绑定在此对象上,然后Return回去。这就是我总结的Angular中三种自定义服务的区别,其实这三种服务还有其它定义方式,可以通过config定义,也可以直接在声明module时当第三个参数传入进去使用,本人认为使用module方法简单,所以今天只是总结了这种方法。