Pet*_*ter 12 operator-keyword observable rxjs angular
我有3个依赖的Rest API资源(比如说observables),如下所示:
1st observable生成一个项目作为用户数组,如下所示:
getUsers(): Observable<User[]>
[
{
"id": 1,
"name": "Peter",
"surname": "Smith"
},
{
"id": 2,
"name": "John",
"surname": "Wayne"
},
...
]
Run Code Online (Sandbox Code Playgroud)
第二个observable可用于获取分配给用户的地址,因此输入参数是User ID,并返回一个作为地址数组的项:
getUserAddresses(user_id: string): Observable<Address[]>
[
{
"id": 1,
"city": "London",
"street": "Wicombe 34"
},
{
"id": 2,
"city": "Paris",
"street": "La fever 20"
},
...
]
Run Code Online (Sandbox Code Playgroud)
第3个observable可用于获取分配给用户的公司,因此输入参数是User ID,并返回一个项目作为公司数组:
getUserCompanies(user_id: string): Observable<Company[]>
[
{
"id": 1,
"name": "Fintch CO",
"state": "France"
},
{
"id": 2,
"name": "C&C inc.",
"state": "USA"
},
...
]
Run Code Online (Sandbox Code Playgroud)
我想将这3个observable链接成一个将再次产生结果作为一个项目,它将包含其附加地址数组和公司数组的用户数组,如下所示:
[
{
"id": 1,
"name": "Peter",
"surname": "Smith",
"addreesses":
[
{
"id": "1",
"city": "London",
"street": "Wicombe 34"
},
{
"id": "2",
"city": "",
"street": "La fever 20"
}
],
"companies":
[
{
"id": "1",
"name": "Fintch CO",
"state": "France"
},
{
"id": "2",
"name": "C&C inc.",
"state": "USA"
}
]
}
},
{
"id": 2,
"name": "John",
"surname": "Wayne",
"addresses": [...],
"companies": [...],
},
...
]
Run Code Online (Sandbox Code Playgroud)
应该看看运算符是如何在Angular 6中用RxJs 6实现的?非常感谢您的建议.
Pic*_*cci 13
这样的事情可能会起作用
getUsers()
.pipe(
switchMap(users => from(users)),
mergeMap(user => forkJoin(getAddresses(user.id), getCompanies(user.id))
.pipe(map(data => ({user, addresses: data[0], companies: data[1] })))
tap(data => data.user.addresses = data.addresses),
tap(data => data.user.companies = data.companies),
map(data => data.user),
toArray()
)
)
Run Code Online (Sandbox Code Playgroud)
应用于不同用例的类似链将在此处详细说明。
| 归档时间: |
|
| 查看次数: |
16905 次 |
| 最近记录: |