如何将多个 rxjs 可观察对象与单个订阅结合起来？

Question

我有一个 observable 来获取 users，然后我想通过 API 调用为每个用户获取 roles，然后将所有数据组合到一个对象数组中进行显示。

我已经到了这一点，但我认为必须有一种方法可以让我将角色调用与流中的用户结合起来，而不必订阅然后 combineLatest：

  this.getAllUsersParams$
    .pipe(
      switchMap(params => this.userFacadeService.sysadminGetAllUsers(params)),
      map(allUsers => {
        const rolesCalls: Observable<UserRoles[]>[] = [];

        allUsers.users.forEach(user => {
          rolesCalls.push(this.userFacadeService.getUserRoles(user.id));
        });

        return { allUsers, rolesCalls };
      })
    )
    .subscribe(data => {
      combineLatest(data.rolesCalls)
        .pipe(
          map(userRoles => {
            const userListVM: UserListVM[] = data.allUsers.users.map((user, i) => {
              return {
                ...user,
                roles: userRoles[i],
              };
            });
            return { userListVM, total: data.allUsers.total };
          })
        )
        .subscribe(data => {
          // consume data
        });
    })

Answer 1

你在寻找这样的东西吗？

this.getAllUsersParams$
  .pipe(
    switchMap(params => this.userFacadeService.sysadminGetAllUsers(params)),
    switchMap(allUsers => combineLatest(
      allUsers.users.map(user => combineLatest([
        of(user),
        this.userFacadeService.getUserRoles(user.id),      
      ])
    )),
    map((result): { total: number, userListVM: UserListVM[] } => ({
      total: result.length,
      userListVM: result.map(user => ({
        ...user[0],
        roles: user[1]
      }))
    }))
  )
  .subscribe(data => {
    ...
  });

它将每个用户与其角色配对，然后您可以将数据操作为您想要的结构。