为什么嵌套在开关盒中的异步管道永远无法解决？

Question

我无法获取嵌套在开关盒中的可观察物体来解决。在这种情况下，我可以直接在ngSwitch内部获取可观察值。但是，一旦进入开关盒，我的值将始终返回null。

我已经尝试了一些其他方法来解决此问题，但是没有任何进展。也许我对异步管道如何在角度模板中工作有一个误解？

<!--template-->
<ng-container [ngSwitch]="(selectedFilterConfig$ | async)?.filterType">
  <p>{{(selectedFilterValueMap$ | async | json)}}</p> <!--This resolves.-->
  <div *ngSwitchCase="'select'">
    <p>List these...</p>
    <p>{{(selectedFilterValueMap$ | async | json)}}</p> <!--This always comes back null.-->
    <p *ngFor="let item of (selectedFilterValueMap$ | async)"> <!--So does this...-->
{{item.display}}</p>
  </div>
  <div *ngSwitchDefault>
    <p>Not a select!</p>
  </div>
</ng-container>

/* Imports */

interface FilterColumnSelectItem {
  value: string;
  display: string;
}

export interface FilterSelection {
  filter: string;
  value: string;
}

@Component({
  selector: 'app-add-new-filters-dialog',
  styleUrls: ['./add-new-filters-dialog.component.scss'],
  templateUrl: './add-new-filters-dialog.component.html',
})
export class AddNewFiltersDialogComponent implements OnInit {
  public newFilterForm = this.formBuilder.group({
    filterSelection: [''],
    filterValue: [''],
  });

  public filterSelectionFormValue$: Observable<string>;
  public filterValueFormValue$: Observable<string>;
  public tableColumnConfigs$: Observable<ColumnMeta[]>;
  public filterSelectionFormControl: AbstractControl;
  public filterValueFormControl: AbstractControl;
  public selectedFilterConfig$: Observable<FilterConfig>;
  public selectedFilterMeta$: Observable<ColumnMeta>;
  public selectedFilterValueMap$: Observable<FilterColumnSelectItem[]>;

  constructor(
    public dialogRef: MatDialogRef<AddNewFiltersDialogComponent>,
    private formBuilder: FormBuilder
   ) {}

   public ngOnInit(): void {
    this.filterSelectionFormControl = this.newFilterForm.get('filterSelection');
    this.filterValueFormControl = this.newFilterForm.get('filterValue');

    this.filterSelectionFormValue$ = this.filterSelectionFormControl.valueChanges.pipe(val => val);
    this.filterValueFormValue$ = this.filterValueFormControl.valueChanges.pipe(val => val);

    this.selectedFilterMeta$ = combineLatest(this.tableColumnConfigs$, this.filterSelectionFormValue$).pipe(
      map(([metas, filterSelection]) =>
        metas.find(meta => meta.columnName === filterSelection)));

     this.selectedFilterConfig$ = this.selectedFilterMeta$.pipe(
       map(meta => meta != null ? meta.filterConfig : null));

     this.selectedFilterValueMap$ = this.selectedFilterConfig$.pipe(
       map(config => !!config.filterSelectOptions ? config.filterSelectOptions : null))
       .pipe(map(selectionItems => {
         if (!selectionItems) {
           return null;
         }

         return orderBy(selectionItems, 'priority')
           .map(selectionItem => ({value: selectionItem.value, display: selectionItem.display}));
       }));
   }

  /* Rest of component */
}

我希望能够在切换情况通过后获得selectedFilterValueMap$的结果。