RxJs map函数导致upstream observable被多次调用

RxJs map function causes upstream observable to be called multiple times

我对 RxJS 有点陌生,我在 Observable 上遇到 map 问题,这导致上游 Observable 被多次调用(即 HTTP 请求)。

我有以下例子:

https://stackblitz.com/edit/angular-rxjs-playground-uxygsb?file=app%2Fapp.component.ts

要点如下

function simulateHttp(val: any, delay:number) {
    return Observable.of(val)
        .delay(delay);
}

function timeLog(msg) {
    console.log(`${new Date().toISOString()}:  ${msg}`);   
}

const timerStream: Observable<number> = IntervalObservable
  .create(8000)
const manualRefreshStream = new Subject<any>();
const combinedTriggerStream: Observable<any> = Observable.merge(timerStream, manualRefreshStream);

const httpResultStream = combinedTriggerStream.switchMap(v => {
  return simulateHttp('http ' + v, 3000);
});
const dataStream = httpResultStream
  .map(v => `*${v}*`)
  .map(v => `#${v}#`);

基本上,只要我在 httpResult 流上通过 map 进行转换,我就会多次调用 simulateHttp 方法。

我用谷歌搜索了一下,似乎 share 可能是解决方案,但我不太了解把它放在哪里以及 为什么.

我通过

设法删除了多次调用
const httpResultStream = combinedTriggerStream
   .switchMap(v => simulateHttp('http ' + v, 3000))
   .share(); 

仍然不确定我为什么需要这个。

我还发现这篇文章很有帮助,尽管它与我的问题无关 https://blog.angular-university.io/rxjs-switchmap-operator/