Angular4/子元素不触发父(点击)事件

Question

我有一个下拉功能，应该通过点击这个 div 来调用

<div (click)="toggleDropdown($event)" data-id="userDropdown">
 Username <i class="mdi mdi-chevron-down"></i>
</div>

但是当我点击 <i> 时没有触发点击事件元素

toggleDropdown($event) {
    const id = $event.target;
    document.querySelector('[data-drop=' + id.getAttribute('data-id') + ']').classList.toggle('active');
}

无论如何，我可以让子点击事件触发父点击事件吗？

Plnkr

Answer 1

使用 $event.currentTarget 而不是 $event.target

这样您将获得附加了事件处理程序的元素。

Plunker Example

阅读更多

• https://developer.mozilla.org/en/docs/Web/API/Event/currentTarget