markdown Diretivas（For - * ngFor）

Posted 2021-05-06

# Diretivas (For - *ngFor)

É uma diretiva que permite que iteremos um array através de um loop for.

```typescript
export class ngForComponent implements OnInit {

    cursos: string[] = string["Angular","Ruby"];

}
```

Fazemos a iteração com let e não com var, pois é uma convenção do ES6.

```HTML
<ul>
    <li *ngFor="let curso of cursos">
        {{ curso }}
    </li>
</ul>
```

Para receber o índice de cada elemento, faremos da seguinte maneira.

```HTML
<ul>
    <li *ngFor="let curso of cursos, let i = index">
       {{ i + 1 }} - {{ curso }}
    </li>
</ul>
```