如何在我的管道中正确实现 forkJoin答案

【问题标题】：How to correctly implement forkJoin in my pipe如何在我的管道中正确实现 forkJoin
【发布时间】：2020-05-07 00:16:29
【问题描述】：

我有下一个管道：

this.adminService.companies$
      .pipe(
        takeUntil(this.unsubscriber),
        map((data: CompanyCard[]) => {
          const companies: CompanyCard[] = [...data.map(company => ({...company}))]

          companies.forEach((company: CompanyCard) => {
            if ('_seconds' in company.created) {
              company.created = new Date(company.created._seconds * 1000)
            }

            if (company.owner) {
              this.userService.getUser(company.owner).pipe(
                take(1),
                takeUntil(this.unsubscriber),
                map((data: User) => data.email)
              ).subscribe(email => company.owner = email)
            }
          })

          return companies;
        }),
        tap(companies => this.companies = companies)
      ).subscribe();

我的问题是当我在模板中呈现这些数据时，我看到闪烁的内容，因为我在 map() 内的所有转换完成之前获取了数据。所以我想我必须将所有运算符包装在forkJoin 中，但我不知道如何正确地做到这一点。

【问题讨论】：

标签： rxjs rxjs-pipeable-operators

【解决方案1】：

像这样：

this.adminService.companies$
  .pipe(
    takeUntil(this.unsubscriber),
    map((data: CompanyCard[]) => data.map(company => '_seconds' in company.created
      ? ({ ...company, created: new Date(company.created._seconds * 1000) })
      : company
    )),
    switchMap((data: CompanyCard[]) => forkJoin(data.map(company => company.owner
      ? this.userService.getUser(company.owner).pipe(
        take(1),
        takeUntil(this.unsubscriber),
        map((user: User) => ({ ...company, owner: user.email }))
      )
      : of(company)
    )))
  )
  .subscribe(companies => {
    this.companies = companies;
  });

【讨论】：