Angular.js的Promise API提供了异步处理,但是AngularJS只有很少的异步处理库支持,如果你写复杂的异步处理功能,需要自己编写库包。而Reactive Extensions for JavaScript (RxJS)则提供强大的reactive异步处理。
RxJS中添加了Observable.fromPromise功能,实现RxJS和AngularJS Promise衔接。
简单比较:
AngularJS Promise:
var res = $resource("/hoge"); res.get().$promise .then( function(data){ alert("success: " + data); }, function(err){ alert("failure: " + err); } );
|
RxJS:
var res = $resource("/hoge"); Rx.Observable.fromPromise(res.get().$promise) .subscribe( function(data){ alert("success: " + data); }, function(err){ alert("failure: " + err); } );
|
更复杂一些代码,需要调用更多功能:
AngularJS Promise:
var res1 = $resource("/hoge"); var res2 = $resource("/fuga/:id"); res1.get().$promise .then(function(data){ return res2.get({id: data.id}).$promise; }) .then( function(data){ alert("success: " + data); }, function(err){ alert("failure: " + err); } );
|
RxJS:
var res1 = $resource("/hoge"); var res2 = $resource("/fuga/:id"); Rx.Observable.fromPromise(res1.get().$promise) .selectMany(function(data){ return Rx.Observable.fromPromise(res2.get({id: data.id}).$promise); }) .subscribe( function(data){ alert("success: " + data); }, function(err){ alert("failure: " + err); } );
|
RxJS更强大的功能,重试几次连接:
var res = $resource("/hoge") Rx.Observable.defer(function(){ return Rx.Observable.fromPromise(res.get().$promise); }) .retry(3) .subscribe( function(data){ alert("success: " + data); }, function(err){ alert("failure: " + err); } );
|
压缩:
var res1 = $resource("/hoge"); var res2 = $resource("/fuga"); Rx.Observable.fromPromise(res1.get().$promise) .zip(Rx.Observable.fromPromise(res2.get().$promise), function(data1, data2){ return [data1, data2]; } ) .subscribe( function(data){ alert("success: " + data[0] + ":" + data[1]); }, function(err){ alert("failure: " + err); } );
|