没有合适的资源?快使用搜索试试~ 我知道了~
首页Angular异步变同步处理方法
资源详情
资源评论
资源推荐

Angular异步变同步处理方法异步变同步处理方法
今天小编就为大家分享一篇Angular异步变同步处理方法,具有很好的参考价值,希望对大家有所帮助。一起跟
随小编过来看看吧
1. 背景背景
在前端项目中,经常会遇到页面有多个接口,后一个接口参数需要从前一个接口的返回数据中获取,这就存在接口必须按顺序
一个一个执行。而Angular提供的Http服务请求接口都是异步请求,因此通常情况下会写成如下的代码:
funA(arg1,arg2,function(){
funcB(arg1,arg2,function(){
funcC(arg1,arg2,function(){
xxxx....
})
})
});
这不仅造成页面代码混乱不易维护,也让开发者无法追踪代码的运行。本身嵌套就已经不容易理解,加上不知何时才能触发回
调,这就相当于雪上加霜。
2. Promise
针对这中现象,Angular推出了Promise规范,它可以帮助开发者将异步变成同步,是一种对执行结果不确定的一种预先定
义。例如以下代码中,当getData方法内的对象成功执行,就会调用success方法,如果失败,就会调用error方法。另外
promise除了then方法之外,还有catch()与finally()方法。
defer. getData()
.then( funcSuccess (){}, funcError (){} )
.catch( function(){})
.finally( function(){});
Finally()方法一般用来处理不管promise是返回成功还是失败,都会执行的操作。例如ionic中的上拉加载,当获取数据后不管
成功或者失败,都要广播结束这次上拉操作,便可将这个操作写在finally()方法中。
3. $q服务服务
q服务是AngularJs中自己封装实现的一种Promise实现,一般有如下三个常用方法:
defer() :创建一个deferred对象,这个对象可以执行几个常用的方法,比如resolve,reject,notify等;
all() :传入Promise的数组,批量执行,返回一个Promise对象;
when() :传入一个不确定的参数,如果符合Promise标准,就返回一个Promise对象。
3.1. defer() 方法方法
在$q服务中,用defer()方法创建一个deferred对象,然后这个对象可以调用resolve方法定义成功状态,使用reject方法定义失
败状态,并且可以在这些方法中传递参数,一般接口返回的数据都是用这些方法传递出去。最后通过deferred对象 .promise来
返回一个promise对象,来定义then方法。then方法中有三个参数,分别是成功回调、失败回调、状态变更回调。
定义方法:定义方法:
function funA(num){
var defer = $q.defer();
if(num<5){
defer.resolve('funA success');
}else{
defer.reject('funA error');
}
return defer.promise;
}
方法调用方法调用(返回成功返回成功)::
funA(3).then(function(success){
console.log(success);
},function(err){
console.log(err);
})
结果:















安全验证
文档复制为VIP权益,开通VIP直接复制

评论0