我有一个从API提取一些数据的组件.该组件具有加载成员变量,该变量用于确定是否应显示加载图标.数据获取完成后,将加载设置为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是否具有等效功能,或者有更好的实现方法？

解决方法:

从RXJS 5.5开始,使用“ finalize”运算符：

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