Angular http请求的串联 [英] Concatenation of Angular http requests

问题描述

我正面临以下情况. 有一个使用Angular(2)构建的前端应用程序，该应用程序与可通过http访问的REST后端连接. 一旦用户登录(使用电子邮件和密码)，后端就会返回与该用户相关的数据，尤其是与该用户相关联的ID(我们将其称为 userId )以及该区域的代码他住(我们称其为 regionId ). 通过 userId ，我可以查询后端以获取用户所属的相似性组ID(我们称其为 affinityId ). 最后，使用 affinityId 和 regionId ，我可以从后端检索折扣以应用于用户.

I am facing the following scenario. There is a Front End app, built with Angular(2), which is connected with a REST Back End accessible via http. Once an user logs in (using email and pwd), the Back End returns data related to the user and in particular an id associated with the user (let's call this userId) and the code of the region where he lives (let's call this regionId). Via the userId I can query the Back End to get the affinity group ID to which the user belongs (let's call this affinityId). Finally, using affinityId and regionId I can retrieve from the Back End the discount to apply to the user.

换句话说，后端提供3个API:

In other words, the Back End offers 3 APIs:

• getUserData(电子邮件:字符串，密码:字符串):返回所有用户数据，包括 userId 和 regionId
• getAffinityPerUser(userId:number):返回一个表示 affinityId
的数字
• getDiscount(regionId:number，affinityId:number):返回代表折扣
的数字

• getUserData(email: string, pwd: string) : returns all user data including userId and regionId
• getAffinityPerUser(userId: number) : returns a number representing the affinityId
• getDiscount(regionId: number, affinityId: number) : returns a number representing the discount

如果我通过Angular http客户端访问这些API，则可以构建以下API(采用某种Javascript伪代码)

If I access these APIs via Angular http client I can build the following APIs (in a sort of Javascript pseudo code)

• getUserData(电子邮件:字符串，密码:字符串):可观察(< {userId， regionId，...}>)
• getAffinityPerUser(userId:number):Observable()
• getDiscount(regionId:number，affinityId:number): Observable()

• getUserData(email: string, pwd: string) : Observable(<{userId, regionId, ...}>)
• getAffinityPerUser(userId: number) : Observable()
• getDiscount(regionId: number, affinityId: number) : Observable()

我想知道是否可以使用RxJs运算符将此类Observable结合起来以获得我想要的折扣信息.

I would like to know if I can combine such Observables using the RxJs operators to obtain the discount info which I am looking for.

我可以通过switchMap连接前两个API，以获取 affinityId ，例如

I can concatenate the first 2 APIs via switchMap to get the affinityId with something like

this.getUserData(email, pwd)
     .switchMap(userData => this.getAffinityPerUser(userData.userId))

但是我不知道如何将 affinityId 可观察(由getAffinityPerUser返回)与userData Observable(由getUserData返回)相结合，以同时具有 affinityId 和 regionId ，我需要调用getDiscount API.

but then I do not know how to combine the affinityId Observable (returned by getAffinityPerUser) with the userData Observable (returned by getUserData) to be able to have both affinityId and regionId which I need to call the getDiscount API.

非常感谢您的帮助

推荐答案

您可以像这样组合所有操作:

You can combine all your operations like this :

this.getUserData(email, pwd)
     .switchMap(userData => this.getAffinityPerUser(userData.userId)
                                .map(affinity => [affinity, userData.regionId])) // return a tuple combining required elements
     .switchMap(([affinity, regiondId) => this.getDiscount(regionId, affinity)) // use destructuration to extract the 2 elements of the tuple

这篇关于Angular http请求的串联的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！