显示单击元素的多个加载指示器

Question

我有这个*ngFor

<div *ngFor="let notificacao of notificacoes; let i = index">
   {{notificacao.marketplace}}
   {{notificacao.data_entrada | date:'dd/MM/yyyy'}} 
   {{notificacao.data_entrada | date:'shortTime'}}
   <h6><strong>{{notificacao.mensagem}}</strong>
      <i *ngIf="loading && identificadorLoading == notificacao.identificador"></i>
      <svg *ngIf="identificadorLoading !== notificacao.identificador || !loading" (click)="testaLoadingExclusao(notificacao.identificador, i)">
      </svg>
   </h6>
</div>

我的功能testaLoadingExclusao()

testaLoadingExclusao(identificador, index){
    this.loading = true;
    this.identificadorLoading = identificador
}

我如何才能使加载显示在单击的1个以上元素中？

我现在所拥有的：

Answer 1

尝试使用像这样的数组，而不是仅跟踪一个加载指示器：

private identificadorLoading: string[] = [];

....

testaLoadingExclusao(identificador, index){
    this.loading = true;
    this.identificadorLoading.push(identificador);
}

并在您的html中：

<div *ngFor="let notificacao of notificacoes; let i = index">
   {{notificacao.marketplace}}
   {{notificacao.data_entrada | date:'dd/MM/yyyy'}} 
   {{notificacao.data_entrada | date:'shortTime'}}
   <h6><strong>{{notificacao.mensagem}}</strong>
      <i *ngIf="loading && identificadorLoading.includes(notificacao.identificador)"></i>
      <svg *ngIf="!identificadorLoading.includes(notificacao.identificador) || !loading" (click)="testaLoadingExclusao(notificacao.identificador, i)">
  </svg>
   </h6>
</div>