angular - 如何在指令中收听子元素事件？

Question

由于没有模板，在指令中监听子元素事件的最佳方式是什么？ HostListener 是否可行？如果不行，还有其他办法吗？

还有一个类似的问题:How to listen for child event from parent directive in Angular2 ，但建议的方法不能解决我的问题，因为我的指令和子元素不在同一个模板中(指令在主机上)。

干杯!

编辑 #1

这就是我目前正在做的(必须有更好的方法):

首先将 ElementRef 注入(inject)到我的指令中:

constructor(private elView: ElementRef) {}

然后与 jQuery(或纯 JS)绑定(bind):

$(this.elView.nativeElement)
.on('drag', '#childId', this.slide.bind(this))

Answer 1

如果你想监听的事件是一个冒泡的原生DOM事件，那么你可以只使用@HostListener()

@HostListener('click', ['$event'])
handleClick(event) {
  // handle event
}

如果它们是子组件的输出，您可以查询它们并订阅它们的输出

@ContentChildren(ChildComponent) children:QueryList<ChildComponent>;

ngAfterContentInit() {
  this.children.toArray().forEach((item) => {
    item.someOutput.subscribe(...);
  });
}

或者您可以使用您在问题中链接到的答案中使用的方法。