仅对子项应用onclick

Question

如何对div元素中的每个项目应用onclick

<div>
<p (click)="Click(1)" value="1">1 element</p>
<p (click)="Click(2)" value="2">2 element</p>
<p (click)="Click(3)" value="3">3 element</p>
</div>

如您所见，我展示了一种非常糟糕的方法，是否有任何更清晰，更简单的方法可以做到这一点。 顺便说一句。 div中的列表是动态的

Answer 1

@Dakito尝试此操作...将数组创建为values，然后

    <div>
      <p (click)="Click(value)" *ngFor="let value of values" value="value">{{value}} element</p>
    </div>

Answer 2

TypeScript类

items = [{ number: 1 }, { number: 2 }, { number: 3 }];

模板：

<div>
    <p *ngFor="let item of items" 
        (click)="Click(item.number)" 
        [value]="item.number">
        {{item.number}} element
    </p>
</div>