ngfor use index in elements click event

问题

I am trying to make a remove button on my chips so I tried:

<mat-chip-list>
  <mat-chip *ngFor="let condition of conditions; let i = index">
    {{condition.column.friendlyName}} {{condition.operator.symbol}} {{condition.value}} 
    <mat-icon class="close-icon" (click)="removeChip(i)">highlight_off</mat-icon>
  </mat-chip>
</mat-chip-list>

but it says i is not defined. What is correct way to get the chips index when it is clicked?

回答1:

this is updated in angular 5+ to index as i:

<mat-chip *ngFor="let condition of conditions; index as i"> 
  {{condition.column.friendlyName}} {{condition.operator.symbol}} {{condition.value}} 
  <mat-icon class="close-icon" (click)="removeChip(i)">highlight_off</mat-icon>
</mat-chip>

来源：https://stackoverflow.com/questions/52618538/ngfor-use-index-in-elements-click-event