angular中怎样创建出须要的service

扯淡的话----------作为一个老魔兽玩家,我很喜欢将写代码和玩游戏举行对照,在运用差别的框架时,就好像我们在切换禀赋妙技,拿盗贼来讲,灵敏禀赋有个妙技叫阴影之舞(良久没玩,不晓得还在不),开了以后许可在非潜行状态下运用潜行妙技,比方狙击,锁喉什么的,这就好像在框架里我们须要晓得哪一个要领可以在什么状态下运用,在什么时间用,比方盗贼内战时,高手会用消逝来躲致盲,在须要迸发时,贼们也会消逝进入潜行来一波迸发。。。。。所以晓得我们可以做什么,怎样做,什么时间做,是成为高手必需的修行,好了,空话不多说,进入正题。

Angular运用是由很多对象构成,这些对象依据肯定的关联被关联在一起,大多数情况下我们并不须要体贴它们是怎样被组织在一起,以及相互之间是怎样举行合作的,但想要更密切angular,就必需相识这一历程。
大体上来讲angular的对象可以被分为两类,一类是像services这类由开辟者定义的,用来供应运用所须要的大众API,一类是由angular框架定义好的具有特定用处的对象,比方controller、filter、directive等。那末这些对象是怎样被定义出来的?除了injector外别无它法,然则关于injector来讲,它须要晓得怎样去定义这些对象,关于内置的那些对象来讲,我们固然不须要加入,angular为此暴露了5个API,分别是value(),service(),factory(),constant(),以及最为壮大的provider(),前四个实在就是provider()的语法糖。虽然对象的建立是由injector来完成,但这5个要领倒是angular模块的要领,也就是说我们在挪用的时刻须要在模块上去挪用,例1:

var myModule = angular(“myModule”,[]); 
myModule.value(“name”,”superMan”);

在angular中,一切的效劳都是单例对象,也就是说它们只会被挪用一次,以后在injector中会保留效劳的援用,在须要的时刻将其看成依靠注入进去。
一、value()
例1中我们已定义了一个效劳,那末我们就可以够在任何须要的时刻把它注入到我们的控制器中,例2:

myModule.controller(“myController”,[“name”,function(name){
    this.name = name;
}]);
<body ng-controller = “myController as con”>
    Name:{{con.name}}
</body>

如许我们就可以够胜利的拿到这个注册的名字”superMan”,而且可以在视图中准确的读到它。
它就是云云的简朴。
二、constant()
这个要领和value()一样的简朴,唯一的差别是,constant()注册的值可以在angular运转的设置阶段接见到。例3:

myModule.constant(“prefix”,”ECS”);
myModule.config([“prefix”,function(pre){
    //这里的pre将会被准确的接见
}]);
myModule.config([“name”,function(name){
    //这里去接见name将会抛出毛病,由于此时效劳都还没有被注册
}]);

angular运用的生命周期被分为设置和运转两大阶段,在设置阶段,我们所写的效劳都还没有注册进来,所以在这个时刻去接见经由过程value()要领注册的值,是不可接见到的。固然constant()注册的值在运转阶段也是可以被准确的接见的。也就是说它们一个是全周期可见,一个是只需运转阶段可见。
三、factory()
以上两个要领都异常的简朴,注册的值也一样的简朴,现实情况中我们须要一些越发庞杂的效劳来供应越发健全的功用。Factory()同它们比拟具有更强的才能,1、经由过程依靠注入可以援用到别的的效劳。2、初始化效劳。3、耽误加载效劳,也就是说在须要的时刻angular才去初始化。例4:

myModule.factory("name",function nameFactory(){
    return "superMan";
});

我们将例1中经由过程value()注册的值用factory()重写,这里我们用到了函数,这个函数可以接收一个或多个参数,只需这些参数已被angular注册,它们就可以被看成依靠被准确的加载进来,函数的返回值将被作为效劳的实例被其援用到。这就给我们供应了更多的可以,我们可以返回一个简朴值 ,固然也可以返回个对象或函数,总之看你须要。例5:

myModule.factory("fullName",["name",function fullNameFactory(name){
    var firstName = "XX";
    var fn = function(f,l){
        return f + l;
    }
    return {
        name:fn(firstName,name)
    }
}]);

在这里,函数的名字不是必需的,然则最好给它起一个可以很随意马虎辨识的名字,这在调试程序时将会异常有效,一旦失足,你可以很随意马虎的在客栈追踪中发明它。
四、service()
在面向对象的开辟中,我们常常会用到自定义的类,固然,我们可以运用factory()要领来把这些类注册为效劳,例6:

function Person(name){
    this.name  = name;
    this.speak = function(){
        console.log("my name is " + this.name);
    }
}
myModule.factory("person",["name",function person(name){
    return new Person(name);
}]);

在建立效劳时,service()要领和factory()要领唯一的差别之处就是它运用new运算符来给我们实例化一个对象,也就是这个时刻我们应当给service()传入一个组织函数,组织函数可以接收0个或多个参数,这些参数从哪来?固然是依靠注入,既然在factory()中我们都可以依靠注入,在service()中固然也可以,用service()来重写例6:

myModule.service("person",[“name”,Person]);

一览无余,无需多言。
五、provider()
前面说过,以上4种要领都是provider()的语法糖,也就是说上面4种要领具有的才能,provider()都具有。Providr()的才能是最壮大的,但在现实开辟中有时刻会显的过犹不及,永久记着,只选最适合你的。
关于provider()而言,它必需有一个$get()要领,这是区分于上面4种要领最为显著的处所,关于$get()的参数,可以经由过程依靠注入来猎取,这个函数就像factory()的工场函数,现实上关于factory()而言,angular会自动给它的函数设置一个空的$get()要领。
别的,前面我们提到过angular运用生命周期的2个阶段,犹如constant()要领,provider()要领固然也可以在设置阶段运转,因而,关于provider()它最实用的场景就是在应当启动前给我们暴露一些API,以便我们可以经由过程这些API对运用举行设置。它注册的效劳应当是我们愿望在差别的运用间可以重用,且效劳的行动在各有运用间异常一致,或者说变化异常小。
例7:

myModule.provider("speakName",function speakNameProvider(){
var firstName = "";
this.addFirstName = function(f){
    console.log(“my firstName is:” + f);
    firstName = f;
}
    this.$get= ["name",function speakNameFactory(name){
        var fullName = firstName + name;
        return new Person(fullName);
    }];
});

如果我们愿望在运用设置阶段加上一个姓,那末就可以够经由过程暴露的API完成

myModule.config(["speakNameProvider",function(speakNameProvider){
    speakNameProvider.addFirstName("XXX");
}]);

回到开首说的,angular的对象分为两类,关于我们可以定义的,前面已引见完了,关于angular已内置的一些对象,我们在运用时刻必需遵照它的划定规矩,比方controller、directive、filter等。固然我们定义好的这些效劳可以被作为依靠注入到这些特别对象中,比方:

myModule.directive("myName",["name",function myName(name){
    return {
        restrict:"EA",
        scope:{},
        link:function(scope,ele,attrs){
            ele.text("name:" + name);
        }
    }
}]);
    原文作者:sxlwar
    原文地址: https://segmentfault.com/a/1190000008489309
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞