进军帝都！
服务是在angularJs环境中工作的主力，服务是为web应用程序提供功能的单例对象，例如，web应用程序的一个共同任务是执行web服务器的ajax请求，angularJS提供了HTTP服务，其中包含了用来访问web服务器的所有功能。
服务功能和上下文或状态是完全独立的，因此他可以很容易的被一个应用程序的组件使用，angularJs提供了很多内置的服务组件用于基本的用途，如HTTP请求，日志请求，分析和动画等， 你也可以创建自己的服务，并在你的代码中复用他们。
provider
provider()是创建service最底层的方式，这也是唯一一个可以使用.config()方法配置创建service的方法
运行provider的时候会默认调用this.$get方法
什么时候使用provider()方法
1、当我们希望在应用开始前对service进行配置的时候就需要使用到provider()。比如，我们需要配置services在不同的部署环境里面（开发，演示，生产）使用不同的后端处理的时候就可以使用到了
2、当我们打算发布开源，provider()也是首选创建service的方法，这样就可以使用配置的方式来配置services而不是将配置数据硬编码写到代码里面。
比如说配置一个计算功能的服务
<div class="col-lg-4 col-lg-offset-4 form-group" ng-controller="ctrl as vm ">
<input type="text" class="form-control" ng-model="vm.a">
<select name="" id="" class="form-control" ng-model="vm.select">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<input type="text" class="form-control" ng-model="vm.b">
<button class="btn btn-primary" ng-click="vm.computed()">=</button>
{{vm.value}}
</div>
app.provider('my',function(){
this.currency = '€';
var that = this;//get函数的匿名方法中，this指向问题
this.get = function(){
return{
'+':function(a,b){ return that.currency+(a+b)},
'-':function(a,b){ return that.currency+(a-b)},
'*':function(a,b){ return that.currency+(a*b)},
'/':function(a,b){ return that.currency+(a/b)},
}
}
});
app.config(function(myProvider){ //为了给service进行配置，我们可以将provider注入到.config()方法里面
myProvider.currency = '美元'
});
app.controller('ctrl', function (my) {//将provider注入到controller中，传入名字就行
this.computed = function(){
console.log(1)
this.value = my[this.select](this.a,this.b);
}
});
factory
Angular里面创建service最简单的方式是使用factory()方法。
工厂函数定义服务，调用该工厂函数将返回服务实例
factory()让我们通过返回一个包含service方法和数据的对象来定义一个service。在service方法里面我们可以注入services，比如 http 和 q等。
什么时候使用factory()方法
在service里面当我们仅仅需要的是一个方法和数据的集合且不需要处理复杂的逻辑的时候，factory()是一个非常不错的选择。
注意：需要使用.config()来配置service的时候不能使用factory()方法
var app = angular.module('appModule',[]);
//除了provider都是不可配置的
//factory直接返回对象
app.factory('my', function () {
return {
'+': function (a,b) {
return a+b
}
}
});
app.controller('ctrl', function (scope,timeout,my) {//在应用里面可以很容易地使用factory ，需要到的时候简单地注入就可以了
scope.method = function () {scope.total = my['+'](scope.a,scope.b);
}
})
service
service()通过构造函数的方式让我们创建service，我们可以使用原型模式替代javaScript原始的对象来定义service。
和factory()方法一样我们也可以在函数的定义里面看到服务的注入
这里的功能和使用factory()方法的方式一样，service()方法会持有构造函数创建的对象
- 什么时候适合使用service()方法
service()方法很适合使用在功能控制比较多的service里面
var app = angular.module('appModule', []);
//除了provider都是不可配置的
//factory直接返回对象
app.service('my', function () {
//直接给实例添加方法//没有进行return
this['+'] = function (a, b) {
return a + b;
}
});
app.controller('ctrl', function (scope,timeout, my) {
scope.method = function () {scope.total = my['+'](scope.a,scope.b);
}
})
constant
常量 ，可以使用config配置
app.config(function (myconstant) {
myconstant.aa = '$';
});
app.constant('myconstant', {
'+':(a,b)=>(a+b),
'-':(a,b)=>(a-b),
'*':(a,b)=>(a*b),
'/':(a,b)=>(a/b),
});
value
常量 不可配置
app.value('myvalue', {
'+':(a,b)=>(a+b),
'-':(a,b)=>(a-b),
'*':(a,b)=>(a*b),
'/':(a,b)=>(a/b),
});
文章评论