如何跟蹤數據是否以完全反應方式加載？

Question

考慮以下代碼

 heroes: Obserable<Hero[]>;
 private _loadHeroes: EventEmitter<void> = new EventEmmiter;

 constructor(heroService: HeroService) {
    this.heroes = _loadHeroes.switchMap(() => heroService.fetchHeroes());
 }

沒有人知道如何通過手動訂閱以適當的反應方式添加諸如heroesLoaded: BehaviorSubject<boolean>類的東西嗎？ 當然可以做類似的事情

    this.heroes = _loadHeroes.switchMap(() => {
      this.heroesLoaded.next(false)
      heroService.fetchHeroes().finally(() => this.heroesLoaded.next(true)
    });

但是我認為這不是最好的方法，其想法是將所有訂閱留給異步管道，並且僅在流中完成所有操作。 我也不想使用如上所述的不純凈的副作用來編寫它。 我嘗試使用pulishBehavior運算符，但是我看不到如何使用它來響應訂閱時刻和價值體現/錯誤時刻。 有可能嗎？ 我對至少可能更好，不一定完美的任何可能的解決方案感興趣。

Answer 1

如果您只想跟蹤它們是否已加載（例如，顯示加載指示器）：

heroes: Obserable<Hero[]>;
heroesLoaded: boolean = false;

constructor(heroService: HeroService) {
   this.heroesLoaded = false;
   this.heroes = of(null).pipe(
       tap(() => this.heroesLoaded = false),
       flatMap(() => heroService.fetchHeroes()),
       finalize(() => this.heroesLoaded = true)
   );
}

如果需要，可以使heroesLoaded一個BehaviorSubject並用this.heroesLoaded.next(false)替換this.heroesLoaded = false行-我不知道會帶來什么好處，但是使用tap和finalize的原理是相同的。