如何按顺序在两个 Observable 之间切换并触发订阅两次？

Question

我正在使用 RxJS。我有两个 Observables（API 调用），它们 return 相同数组的不同信息量。我想在 Observables 之间切换并让订阅识别这两个结果，即每次值被 returned.

时触发

这是一个使用 Typescript 的示例（这不有效）：

let foo = [];
const callOne$ = this.service.getSomeData$; // this should take 0.5 seconds
const callTwo$ = this.service.getAllTheData$; // this should take 6 seconds

callOne$.pipe(
    switchMap(data => data.length > 0 ? callTwo$ : of(data)
).subscribe(data => {
    console.log(data); // this fires once but I want it to fire twice
    foo = data;
});

上面的例子检索callOne$，然后检索callTwo$，然后给我结果。相反，我希望两者的结果按顺序排列。我将如何订阅 Observables 以便接收到第一个结果然后在第二次调用时更新？

Answer 1

最简单的方法可能是

merge(callOne$, callTwo$)
.subscribe(data => { 
    console.log(data); // this fires twice but results are not guaranteed to be ordered
    foo = data;
});

您可以保持顺序，但会发出一个类似这样的事件

forkJoin(callOne$, callTwo$)
.subscribe(([data1, data2]) => { // this fires once with both results ordered
     console.log(data1); 
     console.log(data2);
     foo = data;
 });

如果您希望有 2 个单独的通知来维持顺序，即首先是 callOne$ 的结果，然后是 callTwo$ 的结果，您可以尝试使用 expand 运算符，如下所示

callOne$.pipe(
  expand(val => callTwo$),
  take(2)  // to make sure you do not call callTwo$ infinitely
)
.subscribe(data => { 
  console.log(data); // this fires twice and the results are guaranteed to be ordered
  foo = data;
});

看foo是一个数组，你可能会倾向于使用forkJoin，即第二个选项。

您可以在 this article 中找到更详细的解释。

Answer 2

我发现最好的结果是使用 concat()，它按顺序响应 Observable 结果。

换句话说：

concat(callOne$, callTwo$)
.subscribe(data => {
    console.log(data); // this will fire twice
    foo = data;
});

此代码将 return data 的两个结果，按照 concat() 列表的顺序更新变量。

如何按顺序在两个 Observable 之间切换并触发订阅两次？

How do I switch between two Observables in order and have the subscription fire twice?

rxjs

rxjs6

rxjs-observables