angular - 如何在子组件中触发点击事件？

Question

我想为单击的每个元素运行一个函数。这是目前的情况：

<!-- This is the parent-component -->
<template ngFor let-myData [ngForOf]="someData"> 
    <tr [item]="myData" (click)="toggleActive($event)" child-component>
</template>

子组件如下所示：

<td>{{ item.data1 }}</td>
<td>{{ item.data2 }}</td>
<td>{{ item.data3 }}</td>

每次单击 时tr，我都希望在单击toggleActive的子组件中触发 -function。目前它在父组件中触发。我怎样才能按照我想要的方式完成这项工作？

Answer 1

这应该使用子组件上的模板变量并使用此变量引用它：

<template ngFor let-myData [ngForOf]="getMyData()"> 
    <tr [item]="myData" #child (click)="child.toggleActive($event)" child-component>
</template>