使用 Rxjs 管道我怎么知道可观察对象何时完成？

Question

我的 angular 组件顶部有以下初始化。

public myDataObservable$: Observable<MyData[]>;

在我的组件中的某处，我使用选择器对 Ngrx 存储进行了以下调用，以取回可观察对象的数据。所有这些工作正常，我得到了我想要的数据。

this.myDataObservable$ = this.store.pipe(select(MyDataStore.getMyData));

我需要知道这个 observable 何时完成。我需要设置一个布尔值，当 observable 试图获取的所有数据都完成时，它会关闭加载指示器。这是通过网络服务完成的。

因为 observable 的来源来自其他地方，所以我不能像这样挂起 'complete' 回调 () => {this.loadingIndicator = false}。

我尝试了各种 Rxjs 运算符，例如 TakeUntil 和 Finalize，但都没有成功。这些操作员会立即被调用，我的加载指示器会在上升时快速关闭。

我在互联网上搜索并尝试了许多不同的解决方案，但找不到答案。感谢您抽出宝贵时间查看此内容。

Answer 1

我不是 100% 确定你要的是什么；但为什么下面的代码不起作用？我也不知道您使用的是哪种类型的商店（ngxs、ngrx、？？？）。商店中可能有一个属性在调用时设置加载指示器。当返回成功或出现错误时，它可以再次更新状态。

this.myDataObservable$ = this.store.pipe(select(MyDataStore.getMyData));

this.myDataObservable$.subscribe(
  next: x => console.log('Observer got a next value: ' + x),
  error: err => console.error('Observer got an error: ' + err),
  complete: () => this.loadingIndicator = false),
);

Answer 2

解决方案是将加载指示器的布尔值放在状态中，并将其设置在减速器中。当数据填充时，调用 loading reducer 并将状态布尔值设置为 true。当调用加载成功减速器时，它会将状态布尔值设置为 false。

之后我创建了一个选择器来获取布尔状态。

我现在将其初始化为一个 Observable 布尔值，并且在我的 ngOnInit 方法中我可以声明以下内容，

this.showLoading$ = this.store.pipe(select(TechnopediaStore.getisLoadingData));

有了它，我只需将它应用到我的 .html 中的结构指令，它就完美地工作了。

使用 Rxjs 管道我怎么知道可观察对象何时完成？

Using Rxjs pipe how do I know when the observable completes?

observable

rxjs

angular