Angular 6管道RxJs运算符链接3个相关的可观察量

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)

应用于不同用例的类似链将在此处详细说明。