点击事件不冒泡

Question

在我的页面中.html我有一个这样的div：

<div class="news-text" (click)="expandContent($event)" tappable>
    <h1 class="news-title">{{ post.title }}</h1>
    <p class="news-content">{{ post.content }}</span></p>
    <p class="news-date">{{ post.date }}</p>
</div>

在我的页面中，我有：

expandContent(event) {
    console.log(event.target);
    //bla bla
}

问题是输出始终是div 的单击子级。

例如，如果我单击带有类"news-date">

的段落，则事件目标是"p.news-date"，并且我的函数不会在指定的div 中触发。

如何在指定的div 中触发事件函数？

Answer 1

您可以使用模板变量

<div class="news-text" #div (click)="expandContent($event, div)" tappable>

如果只想传递元素，也可以省略$event,