Question

我正在玩角2和NGRX，但我不是RxJs专家......

我了解了如何声明操作，调度它们并绘制简单数据

@Component({
  selector: 'view-container',
  template: `
    <h1>Seccion {{ viewSection | async }}</h1>
    <map-section [hidden]="!isMapSection()"></map-section>
    <graph-section [hidden]="!isGraphSection()"></graph-section>
    <data-section [hidden]="!isDataSection()"></data-section>
  `
})
export class ViewContainer {

  private viewSection: Observable<MainViewSection>;

  constructor(
    private store: Store<AppState>,
    private mainviewActions: MainViewActions
  ) {
    this.viewSection = this.store.let(getMainViewSection());
  }
}

MainViewSection是一个简单的枚举模型：

export enum MainViewSection {
  Map,
  Graph,
  Data
};

我知道如何使用{{viewSection | async}}显示我从Observable获得的部分，但是如何比较我为了隐藏一个或另一个部分而得到的部分？

在NGRX之前我做了这样的事情：

isGraphSection() {
  return this.viewSection === MainViewSection.Graph;
}

但是现在this.viewSection是一个Observable。关于如何实现这一点的任何想法？

谢谢！

Answer 1

你可以先管它然后比较，如下所示：

{{(viewSection| async) === 1}}

如何根据可观察的值（条件）隐藏/显示数据？

1 个答案: