我有一个 Angular 路由,它使用参数 :client_name
和一个具有方法 getClientDetails(client_name)
的服务,用于从基于 的 HTTP API 获取数据:client_name
。两者都是独立工作的 Observable 方法,但是当我组合 2 个 observable 时,API 调用将在获取参数之前运行(client_name 未定义):
this.route.params.subscribe(params => {
this.client_name = params['client_name'];
this.dataService.getClientDetails(this.client_name).subscribe(
clientdata => {
this.client = clientdata;
console.log(clientdata);
});
如何链接两个可观察量,以便 API 仅在返回 :client_name
后运行?
最佳答案
我们可以在这种情况下使用可管道的 RxJS 运算符。
首先,我们可以使用RxJS的mergeMap将 route
中的可观察值映射到内部可观察值。如果定义了 params
和 params['client_name']
,我们将 params['client_name']
分配给 client_name
属性,这与您的初始代码类似。然后,我们从 dataService
调用 getClientDetails()
方法。如果 params
不存在,我们将 null
转换为可观察对象,然后返回它。
随后,可观察值将在 .subscribe()
block 中返回。从那里,我们可以将响应分配给 client
属性。
import { mergeMap } from 'rxjs/operators';
import { of } from 'rxjs';
.
.
this.route.params.pipe(
mergeMap(params => {
if (params && params['client_name']) {
this.client_name = params['client_name'];
return this.dataService.getClientDetails(this.client_name);
} else {
return of(null)
}
})
).subscribe(response => {
// handle the rest
this.client = response;
})
关于Angular 7 - 嵌套 Observables,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56572705/