我如何等待所有Promise在RxJS中完成?

时间:2016-04-07 22:40:43

标签: javascript rxjs

我有一个Promise列表,我希望得到结果并显示在页面上。

 let directives = ['object-src', 'img-src', 'media-src', 'script-src', 'style-src', 'frame-src', 'child-src'];

 let directivesStream = Rx.Observable.from(directives)
   .map((d) => {
     let q = getSummaryCSP({
       origin: origin,
         directive: d,
         from: moment().subtract(3, 'days').utc().format(),
         to: moment().utc().format()
     });

     return Rx.Observable.interval(10000)
       .flatMap(() => Rx.Observable.fromPromise(queries.query(q)));
   });

 directivesStream.mergeAll().subscribe((response) => {
   let flattenedRes = _.sortBy(response.data, (e) => e.event.count);
   flattenedRes = _.reverse(flattenedRes);
   this.setState({
     cspReport: flattenedRes
   });
 });

所以它正在做的是创建一个间隔为10000的Promise流。但是,最终结果是所有承诺的组合结果,这就是我正在做sortingreversing然后在React中显示结果的原因。

我知道RxJs中的所有内容都是一个流。所以,我不确定我是否可以实现这一目标?

所以,我的问题是我如何创建一个Promise流,在最后10s,所有流必须合并到一个流中,这样我就可以使用所有promises的结果。

2 个答案:

答案 0 :(得分:2)

不确定我是否理解您的问题,但这里有一些指示供您调查:

  • toArray运营商:允许将所有流的排放收集到数组中
  • forkJoin运营商:相当于Promise.all,并行运行所有承诺并收集所有结果

我相信,通过这两个中的一个,你可以实现自己的目标。我让你弄清楚哪些是试图自己解决问题是了解Rxjs的最好方法。您还可以找到运算符列表here。我建议你在发帖前先看看。

答案 1 :(得分:0)

由于您可以在React中将节点模块导入客户端代码,我将查看Async节点模块。我相信你想要发生的执行过程是地图和瀑布的结合。

async.waterfall([
    myFirstFunction,
    mySecondFunction,
    myLastFunction,
], function (err, result) {
    // result now equals 'done'
});
function myFirstFunction(callback) {
    callback(null, 'one', 'two');
}
function mySecondFunction(arg1, arg2, callback) {
    // arg1 now equals 'one' and arg2 now equals 'two'
    callback(null, 'three');
}
function myLastFunction(arg1, callback) {
    // arg1 now equals 'three'
    callback(null, 'done');
}