如何利用角度上的事件模糊

Question

在Jquery中，向<ul>添加了单个事件侦听器，这样我就可以通过事件冒泡来侦听当前li上的事件。

<ul>
 <li>a</li>
 <li>b</li>
 <li>c</li>
 <li>d</li>
</ul>

请建议如何在角度上实现同样的目标。我试着用下面的方法：

1)我只能通过$event.target获得选定的列表元素，但无法获得绑定到列表的数据

<ul (click)="onListClick($event)">
    <li *ngFor="let data of [1, 2, 3, 4]"></li>
</ul>

2)我可以将数据绑定到单击侦听器中，因为我是在li上直接单击事件

<ul>
    <li (click)="onListClick(data)" *ngFor="let data of [1, 2, 3, 4]"></li>
</ul>

注意:我的目标是减少事件侦听器，所以我将事件绑定到<ul>标记，而不是<li>，但是我必须找到将<li>数据获取到<ul>单击侦听器的方法。

Answer 1

可以使用属性绑定语法将值设置为列出项。

<ul (click)="onListClick($event)">
    <li *ngFor="let data of [1, 2, 3, 4]" [value]="data">{{data}}</li>
</ul>

onListClick(event) {
   console.log(event.target.value);
}