Recuperando o valor do índice para os itens no ngFor. (Angular)

Posted on by

Neste post, mostro como pegar o valor do índice dos itens que estão de um vetor que está sendo utilizado na diretiva *ngFor.

Para os exemplos abaixo, considere uma variavel chamada items, que é um vetor com n elementos.

Angular 5/6/7/8/9

<div *ngFor="let item of items;let i = index">
  <p>Indice: {{ i }}: {{ item }}</p>
</div>

 

Versões antigas do Angular

<div *ngFor="#item of items; #i = index">
  <p>Indice: {{ i }}: {{ item }}</p>
</div>

 

Ambos exemplos vão gerar uma div para cada item do vetor, cada um contendo um parágrafo com o indice e o valor do item. A ideia é que, da mesma forma que você atribui o valor de cada elemento do vetor para a variável chamada item, você precisa atribuir o valor da variável index para uma que seja utilizável no template.

Espero ter ajudado.

 

Referência: https://angular.io/api/common/NgForOf

The following two tabs change content below.
My Twitter profileMy Facebook profileMy Google+ profileMy LinkedIn profile

Breno RdV

Arquiteto de Software e Desenvolvedor Backend (quase Fullstack), geralmente trabalho com C#, PowerShell, Python, Golang, bash e Unity (esse é mais por hobby). Estou sempre buscando algo novo para aprender, adicionando novas ferramentas ao meu cinto de utilidades.
Posted in Dev, JavaScript and tagged , , , , .