Question

我有一个从API获取一些数据的组件。该组件具有loading成员变量，用于确定是否应显示加载图标。数据提取完成后，loading设置为false，以隐藏加载图标。无论是否发生错误，都应该发生这种情况。

目前，我已按如下方式实施：

export class MyComponent implements OnInit {

  loading = true;
  data;

  constructor(private dataService: DataService) { }

  ngOnInit() {
    this.dataService.getData().subscribe(data => {
      this.data = data;
      this.loading = false;
    },
    () => {
      this.loading = false;
    });
  }

}

我想知道是否有办法消除this.loading = false的重复。如果我使用Promises，这就是我使用Promise.finally()回调的内容 - 但我不是。在RxJS中是否存在等价物，或者更好的方法来实现它？

Answer 1

从RXJS 5.5开始，使用＆＃34; finalize＆＃34;运营商：

ngOnInit() {
  this.dataService.getData()
  .pipe(
    finalize(() => this.loading = false)
  )
  .subscribe(data => {
    this.data = data;
  });
}

在RxJS中承诺“最终”回调等价物

1 个答案: