[英]combine multiple http calls in RxJS
我是 rxjs 新手。
我正在尝试组合几个可观察对象以从 rest api 获取数据列表并加载到 ngx-datatable
在 ngx-datatable 示例上的服务器端分页之后,我定义了一个 PageData object:
export class PagedData<T> {
data = new Array<T>();
page = new Page();
}
我的组件中有一个有效的 setPage 方法来检索我的用户列表:
setPage(pageInfo) {
this.page.pageNumber = pageInfo.offset;
this.pageObserver = this.userService.getPaged<User>(this.page).subscribe(pagedData => {
this.page = pagedData.page;
this.rows = pagedData.data;
});
}
现在我必须用其他一些逻辑来改进这个解决方案。 来自我的 rest 服务器的用户 object 具有以下形式:
{
"createdAt": "2021-02-20T13:06:23.911Z",
"firstname": "Roberto",
"id": 7,
"lastname": "Rossetti",
"links": [
{
"saleforces": "/users/7/saleforces"
}
],
"name": "robertorossetti",
"parent": null,
"parentId": null,
"updatedAt": "2021-02-20T13:06:23.933Z",
"users": []
}
所以我需要点击链接“/users/7/saleforces”来检索与我的用户相关的销售队伍。 在这里我被困住了。
按照我在此处找到的示例,我尝试实现一个新的可观察对象,以这种方式扩展我的工作代码
public getPagedWithSaleForce2(page: Page, queryParams?: QueryStringParameters, options?: HttpOptions): Observable<PagedData<User>> {
return super.getPaged<User>(page, queryParams, options).pipe(
switchMap((pagedData: PagedData<User>) => {
if (pagedData.data.length > 0) {
return forkJoin(
pagedData.data.map((user: User) => {
const saleForceEndpoint = _.find(user.links, 'saleforces');
return this.getRaw<SaleForce>(saleForceEndpoint.saleforces).pipe(
map((saleForce: SaleForce[]) => {
user.saleForces = saleForce;
return (user);
})
);
})
);
} else {
return of(null);
}
})
);
}
显然这段代码不起作用。
那么,如何用由他们的销售队伍丰富的用户数组填充我的 pageData.data 呢? 如何并行调用 saleForceEndpoint?
在此先感谢您的帮助
我找到了一个解决方案,将问题一分为二:
在我的 controller 中:
# user-list.component.ts
setPage(pageInfo) {
this.page.pageNumber = pageInfo.offset;
this.pageObserver = this.userService.getPagedWithSaleForce(this.page).subscribe(pagedData => {
this.page = pagedData.page;
this.rows = pagedData.data;
});
}
在我的服务中:
# user.service.ts
public getPagedWithSaleForce(page: Page, queryParams?: QueryStringParameters, options?: HttpOptions): Observable<PagedData<User>> {
return super.getPaged<User>(page, queryParams, options)
.pipe(
mergeMap((pagedData: PagedData<User>) => {
return this.followSaleforceLink(pagedData).pipe(
map(users => {
return {users, pagedData};
})
);
}),
map(({users, pagedData}) => {
pagedData.data = users;
return pagedData;
})
);
}
public followSaleforceLink(pagedData: PagedData<User>): Observable<User[]> {
return forkJoin(
pagedData.data.map((user: User) => {
const saleForceEndpoint = _.find(user.links, 'saleforces');
return this.getRaw<SaleForce>(saleForceEndpoint.saleforces).pipe(
map((saleForce: SaleForce[]) => {
user.saleForces = saleForce;
return user;
})
);
})
);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.