RxJS

Question

我有这个 setter，它分配了一个 class 成员可观察 systemAreasOptions$。我在那里这样做是因为它需要等待 mappedItem$ 有一个不为空的发射。我最初在 class 级别分配了 systemAreasOptions$，但它没有等待 mappedItem$。出于某种原因，我什至无法在使用 asyncPipe 时让 HTML 重新呈现。我如何告诉一个 observable（systemAreasOptions$ 等待另一个 observable（mappedItem$），而不是仅仅在另一个 observable 发出的地方分配它？

public set mappedItem(mappedItem: IPermissionsMappedItem) {
    mappedItem.hydrate$Permissions().then(_ => {
        this.mappedItem$.next(mappedItem);
        this.systemAreasOptions$ = from(
            this.lookupService.SYSTEM_AREAS.toNestedLookup()
                .$promise as unknown as Observable<IPermissmissionsLookup[]>
        ).pipe(
            map(systemAreas => orderBy(systemAreas,systemArea => systemArea?.label?.toLowerCase())),
            map(systemAreas => systemAreas.map(area => ({
                ...area,
                permissions: this.getPermissionsForArea(area.id)
            }))),
            shareReplay(1),
            tap(console.log)
        );

        this._subscriptions.add(
            this.systemAreasOptions$.subscribe(
                this.systemAreasOptionsBehaviourSubject$)
        );
    });
}

Answer 1

您可以组合观察值：

创建一个仅发出不为 null 的映射项的可观察对象
仅在发出时发出两个值

我相信您正在寻找 withLatestFrom:

higherOrder$ = mappedItemThatIsNotNull$.pipe(
  withLatestFrom(systemAreasOptions$)
)

在您的模板中：

higherOrder$ | async

这将产生 [mappedItem, systemAreaOptions]

RxJS - 告诉 observable 等待其他 observable 发出非空值

RxJS - Tell observable to wait for other observable to emit non null value

angular

rxjs6

angular11