1、先来看一段Demo,看完这个demo你可以思考下如果使用$.ajax如何处理同样的逻辑,使用ng的promise有何优势?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
|
var
ngApp=angular.module(
'ngApp'
,[]);
/*******************************************************************
* $q为内置服务
****************************************************************/
ngApp.factory(
'UserInfoService'
,[
'$http'
,
'$q'
,
function
($http,$q){
return
{
query:
function
(){
var
defer=$q.defer();
//声明延后执行
$http({method:
'GET'
,url:
'data/students.json'
}).
success(
function
(data,status,headers,config){
defer.resolve(data);
//声明执行成功
console.log(
'UserInfoService success'
);
}).
error(
function
(data,status,headers,config){
defer.reject();
//声明执行失败
});
return
defer.promise;
//返回承诺,返回获取数据的API
}
}
}]);
ngApp.controller(
'MainCtrl'
,[
'$scope'
,
'UserInfoService'
,
function
($scope,UserInfoService){
var
promise = UserInfoService.query();
//同步调用,获取承诺接口
promise.then(
function
(data){
$scope.user=data;
//调用承诺接口resolove()
console.log(
'MainCtrl ...'
);
},
function
(data){
$scope.user={error:
'数据不存在。。。'
};
//调用承诺接口reject();
});
}]);
|
2、什么是promise?
promise是一种用异步的方式处理值的方法,promise是对象,代表了一个函数最终可能的返回值或者抛出的异常,在与远程对象打交道时我们可以把他看作是远程对象的一个代理。 如果说是promise也是异步处理方式的一种,那么我们会想起它和XHR和$.ajax有啥区别呢?
习惯上js使用闭包或者回调来相应非同步返回的数据,比如页面加载之后的XHR请求。我们可以跟数据进行正常交互,就好像它已经返回了一样,而不需要依赖回调函数的触发。
那么ng提出的promise是为了解决什么问题呢? 回调已经被使用了很长时间,通常如果有回调依赖其他还回调时将会时调试变得非常艰难,每一步调用之后都需要显示处理错误。与之不同的是promise提供了另外一个抽象:这些函数返回promise对象。
从一定层面上看ng改变的不是简单的改变代码风格,而是让我对一些思维习惯发起了反思和改善。
回调示例
1
2
3
4
5
6
|
User.get(fromId,{
success:
function
(){
user.friends.find(toId,
function
(){})
},
failure:
function
(){}
})
|
ng promise示例
1
2
3
4
5
6
7
|
User.get(fromId).
then(
function
(user){
},
function
(err){
}).
then(
function
(){},
function
(){});
|
3、为什么使用promise
使用了promise的收获之一是逃脱了回调的固定思维逻辑。promise让异步处理的机制看上去更像是同步,基于同步函数我们可以按照预期来捕获返回值和异常值。可以在程序中的任何时刻捕捉错误,并且绕过依赖于程序异常的后续代码,我们不需要思考这个同步带来的好处。因此使用promise的目的是:获取功能组合和错误冒泡能力的同时,保持代码异步运行的能力。
promise是头等对象,自带了一些约定。
- 只有一个resolve或者reject会被调用到。
- 如果promise被执行或者被拒绝了,依赖于他们的处理程序仍然会被调用。
- 处理程序总是会被异步调用。
4、如何创建promise
想要在angularjs中创建promise,可以使用内置的$q服务,$q服务在它的deferred API中提供了一些方法。
首先把它注入到你想使用它的对象中
1
2
3
4
|
angular.module(
'ngApp'
,[]).
factory(
'UserInfoService'
,[
'$q'
,
function
($q){
//code here
}])
|
要创建一个deferred对象,可以调用defer()方法; var deferred= $q.defer();
deferred对象暴露了三个方法,以及一个可以用于处理promise的promise属性。
- resolve(value)。 deferred.resolve({name:"Kobe",Age:36});
- reject(reason)。 deferred.reject("Can't update user");
- notify(value)。这个方法用promise的执行状态进行响应。
- then(successFn,errFn,notifyFn)。
- catch(errFn)。
- finally(callback)。finally允许我们观察promise的执行或者拒绝,而无需修改结果的值。通常就做一些资源的清理工作。
5、链式请求
1
2
3
4
5
|
GitHubService.then(
function
(data){
}).then(
function
(data){
$scope.Users=data;
});
|
源引:http://www.cnblogs.com/sword-successful/p/4626797.html