Angular4 / Child元素未觸發父（單擊）事件

Question

我有一個下拉功能，只需點擊這個div即可調用

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

但是當我單擊<i>元素時，不會觸發click事件

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示例

閱讀更多

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