Nie*_*iek 4 javascript rxjs typescript angular
我有一个从 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;
});
}
}
Run Code Online (Sandbox Code Playgroud)
我想知道是否有办法消除重复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;
});
}
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
1284 次 |
| 最近记录: |