dai*_*ign 3 reactive-programming observable rxjs angular
我有一个访问两个 Observable 并返回一个 Observable 的函数。
首先订阅第一个 Observable。根据它的答案,是否必须订阅第二个 Observable(也将第一个 Observable 的值传递给它)。但在任何情况下,都应该从函数返回一个 Observable。如果条件确定必须查询第二个 Observable,那么返回的 Observable 应该只在第二个 Observable 完成后才完成。在另一种情况下,返回的 Observable 在第一个 Observable 完成时完成。
到目前为止,我有这个:
private load(): Observable<boolean> {
return this.accessControl.map((res: any) => {
if (res.accessGranted) {
this.dataService.getData(res.id).subscribe((v: number) => {
this.value = v;
}, () => {
this.value = null;
this.showErrorMessage();
});
} else {
this.value = null;
}
return true;
})
.first();
}
Run Code Online (Sandbox Code Playgroud)
返回的 Observable 是第一个的映射版本。但是,到目前为止,我未能等待第二个 Observable 并在 if 子句评估为 true 时返回它的映射版本。
更新
根据 Llai 的回答,我现在想出了这个:
private load(): Observable<boolean> {
return this.accessControl.flatMap((res: any) => {
if (res.accessGranted) {
return this.dataService.getData(res.id)
.catch((err) => {
this.value = null;
this.showErrorMessage();
return Observable.throw(err);
})
.map((v: number) => {
this.value = v;
return true;
});
} else {
this.value = null;
return Observable.of(null);
}
})
.first();
}
Run Code Online (Sandbox Code Playgroud)
你想要 flatMap 功能http://reactivex.io/documentation/operators/flatmap.html
private load(): Observable<boolean> {
return this.accessControl.flatMap((res: any) => {
if (res.accessGranted) {
return this.dataService.getData(res.id);
} else {
return Observable.of(null);
}
})
Run Code Online (Sandbox Code Playgroud)
然后订阅这个可观察序列。这将链接 api 调用。这是 flatMap https://coryrylan.com/blog/angular-multiple-http-requests-with-rxjs上的一个很好的资源