好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

自定义Angular服务

Angular内置了很多服务,比如和浏览器地址栏交互的$location服务,和服务器进行交互的$http服务

自然自己也可以自定义服务。

使用服务可以很好的在多个Angular控制器之间进行交互和共享状态,因此自己创建符合当前需要的服务往往可以使效率事半功倍。

 

如何创建Angular服务?

Angular提供了模型对象的API来定义服务,一下三个函数可以用来创建一般的服务

函数                        定义

provider(name,Object or constructor())      一个可配置的服务,创建的逻辑比较复杂。如果你传递一个Object作为参数,

                          那么这个Object对象必须带有一个$get的函数,此函数需要返回服务的名称。

                          否则Angular会人物传递的是一个构造函数,调用构造函数会返回服务实例对象

factory(name,$get Function())           一个不可配置的服务,创建逻辑比较复杂。需要制定一个函数,当调用这个函

                          数的时候,会返回服务的实例。可以把它看成provider(name,{$get :$getfunction()})

                          的形式。

service(name,constructor())            一个不可配置的服务,创建逻辑比较简单,与上面provider函数的constructor

                          参数类似,Angular调用它可以创建服务实例。

 

provider

     provider中既绑定了factory也绑定了service,并且在注入系统准备完毕前,还可以享受到配置provider的好处

 实例:

  1   var  myApp=angular.module('myApp' ,[]);
   2  myApp.provider('greeter', function  (){
   3       var  salutation='Hello' ;
   4       this .setSalutation= function  (s){
   5          salutation= s;
   6       }
   7  
  8       function   Greeter(a){
   9           this .greet= function  (){
  10               return  salutation+' '+ a;
  11           }
  12       }
  13  
 14       this .$get= function  (a){
  15           return   new   Greeter(a);
  16       };
  17  });

 

factory

     如果有一个类或者对象,需要首先为它提供一些逻辑或者参数,然后才能对它初始化,那么可以使用factory接口。

实例

 1  myApp.factory('greeter', function  (salut){
  2       return   new   Greeter(salut);
  3   });
  4  
 5   function   Greeter(salutation){
  6       this .greet= function  (name){
  7           return  salutation+' '+ name;
  8       };
  9  }

 

service

    factory和service之间不同点在于,service会直接调用传递给它的函数,然后返回执行结果;而factory会使用

    “new”关键字来调用传递给它的构造方法然后再返回结果

实例

 1  myApp.factory('greeter' ,Greeter);
  2  
 3   function   Greeter(salutation){
  4       this .greet= function  (name){
  5           return  salutation+' '+ name;
  6       };
  7  }

 

查看更多关于自定义Angular服务的详细内容...

  阅读:37次