Angular11 rxjs开关映射即使在外部可观察触发器时也不能工作。

Question

我正在尝试下面这基本上需要触发每次过滤器被改变。任何人都可以帮助我在使用更高等级的观测值时做错了什么。

工作版本：

this.filterservice.registerFilters({
                key: this.FILTERS_KEY,
                filters: this.AUDIT_FILTERS,
                sorts: [new DateSort({ for: 'modifiedOn' })]
            }).pipe(
                takeUntil(this.destroy$)
            ).subscribe(filters => {
                this.filters = filters;
                this.auditBuilderListService.changeFilter(filters);
                this.auditData$ = this.auditBuilderListService.auditBuilderData$;
            });

有开关图(不工作)：

registerFilters$ = this.filterservice.registerFilters({
        key: this.FILTERS_KEY,
        filters: this.AUDIT_FILTERS,
        sorts: [new DateSort({ for: 'modifiedOn' })]
    });

    auditData$ = this.registerFilters$.pipe(
        switchMap((filters) => {
            this.filters = filters;
            this.auditBuilderListService.changeFilter(filters);
            return this.auditBuilderListService.auditBuilderData$;
        }),
        takeUntil(this.destroy$)
    );

在役：

auditBuilderData$ = combineLatest([
    this.pageNumberSubject,
    this.filterAction$
]).pipe(
    switchMap(([currentPage, filterParameters]) => {
        return this.getAudits(filterParameters, currentPage, this.pageSize);
    }),
    shareReplay(1)
);

没有开关图的工作版本: auditData$：可观察；

registerFilters$ = this.filterservice.registerFilters({
    key: this.FILTERS_KEY,
    filters: this.AUDIT_FILTERS,
    sorts: [new DateSort({ for: 'modifiedOn' })]
}).pipe(
    tap(filters => {
        this.auditBuilderListService.setPage(1);
        this.filters = filters;
        this.auditBuilderListService.changeFilter(filters);         
    }),
    takeUntil(this.destroy$)
);

    this.registerFilters$
        .pipe(takeUntil(this.destroy$))
        .subscribe(filters => {
            this.auditData$ = this.auditBuilderListService.auditBuilderData$;
        });

但是否有更好的方法来实现同样的目标呢？

Answer 1

关于auditBuilderListSerivce，我假设调用changeFilter()会导致auditBuilderData$发出一个新值。如果是这样的话，这就解释了为什么您的switchMap不能工作。返回auditBuilderData$太晚了，因为它会在调用changeFilter()时发出值。

至于解决方案，您可以让changeFilter()返回您想要发出的值(如果可能的话)。另一种选择是分别引用和订阅auditBuilderData$。

registerFilters$ = this.filterservice.registerFilters({
  key: this.FILTERS_KEY,
  filters: this.AUDIT_FILTERS,
  sorts: [new DateSort({ for: 'modifiedOn' })],
}).pipe(
  tap(filters =>{
    this.filters = filters;
    this.auditBuilderListService.changeFilter(filters);
  }),
  takeUntil(this.destroy$)
);

auditData$ = this.auditBuilderListService.auditBuilderData$;
  takeUntil(this.destroy$)
);

当您对这两个可观察到的对象进行活动订阅时，registerFilters$将调用changeFilter()作为副作用，这将导致auditData$发出它的新值。