Назначьте имя или идентификатор в Mat-Icon Angular 7

Question

Я бы хотел получить какое-то значение в mat-icon и сравнить с "campaign_id"

У меня есть два значка, один для воспроизведения, а другой для паузы, когда я нажимаю один, другой появляется

в моем HTML у нас есть ...

<tr *ngFor="let campaign of campaigns">
    <td>{{ campaign.id }}</td>
    <td>{{ campaign.nome_campanha }}</td>
    <td>            
       <label [ngClass]="status[campaign.status].color">{{ status[campaign.status].description }}</label>
    </td>
    <td> 
       <mat-icon id="row-click" matTooltip="Ativar campanha" (click)="occurrence(1, campaign, _icon)" #_icon>play_circle_outline</mat-icon>
       <mat-icon id="row-click" matTooltip="Pausar de campanhas" (click)="occurrence(2, campaign)" *ngIf="run == 1 || run == campaign.id">pause</mat-icon>
    </td>  
</tr>

и в TS мы имеем для ex

occurrence(e, campaign, i) {
  if(user.id == icon.id//icon.name) 
     if(icon.play == show)
       icon.play == hidde
}

это будет логика нажмите на значок воспроизведения или паузы

Answer 1

, поскольку вы находитесь в *ngFor; идентификатор (id="row-click и #_icon) будет одинаковым для всех <mat-icon>, поэтому вместо того, чтобы решить эту проблему, вам нужно использовать и индексировать, и назначить индекс до <mat-icon>

например:

<tr *ngFor="let campaign of campaigns;index=i">
    <td>{{ campaign.id }}</td>
    <td>{{ campaign.nome_campanha }}</td>
    <td>            
       <label [ngClass]="status[campaign.status].color">{{ status[campaign.status].description }}</label>
    </td>
    <td> 
       <mat-icon [id]="'row-click-' + i" matTooltip="Ativar campanha" (click)="occurrence(1, campaign, _icon)" #_icon>play_circle_outline</mat-icon>
       <mat-icon [id]="'row-click-' + i" matTooltip="Pausar de campanhas" (click)="occurrence(2, campaign)" *ngIf="run == 1 || run == campaign.id">pause</mat-icon>
    </td>  
</tr>