angular - 如何在不通过模板连接的情况下收听 ContentChild 事件？

Question

我需要从选项卡组件数组中监听事件。这些选项卡发出“onMinimized”但是我宁愿在一行代码中连接到这些事件而不是输入 (onMinimized)="hide"对于模板中的每个选项卡组件条目。有一个我可以循环遍历的 ContentChildren 数组。

我想在父级中执行类似于 has 以下的操作:

@ContentChildren(TabComponent) tabs: QueryList<TabComponent>;

...

ngAfterContentInit() {
  this.tabs.map((t: TabComponent) => {
    t.addEventListener("onMinimized", this.hide);
  });
}

hide() {
  // hide tabs
}

想法？

Answer 1

经过一些试验和错误后弄清楚了。

  ngAfterContentInit() {
    this.tabs.map((t: TabComponent) => {
      t.minimizeTab.subscribe(() => { this.hide(); })
    });
  }

解决这个问题的方法是考虑组件有一个属性，它是一个 EventEmitter(就像所有的 Angular 输出一样)。 EventEmitters 是可观察的，所以你可以简单地订阅事件流。