代码之家 › 专栏 › 技术社区 › Vladimir Humeniuk

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

rxjs-pipeable-operators rxjs

0

Vladimir Humeniuk · 技术社区 · 4 年前

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

1 回复 | 直到 4 年前

1

Mike Jerred 4 年前

这样地:

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;
  });