Angular: Diretivas estruturais

Neste curso apresentaremos as diretivas estruturais do Angular ngIf, ngFor e ngSwitch, que são análogas as estruturas de controle que estudamos em algoritmos e lógicas de programação. Aprenda sobre elas aqui!

A primeira diretiva estrutural que veremos é o ngIf, que funciona de forma similar a estrutura condicional if: dado um valor booleano, se verdadeiro um bloco de código deve ser executado.

A diretiva estrutural *ngFor, parte da sintaxe de templates do Angular, funciona de forma similar a estrutura de laço for … of, do JavaScript. Aprenda nessa aula.

A diretiva estrutural *ngSwitch é utilizada para, com base em diversas condições, selecionarmos o que deve ser exibido para o usuário. Ela pode substituir e tornar mais legível o código que usa diversos *ngIf.

Nas versões atuais do Angular não é permitido utilizar mais de uma diretiva estrutural em um mesmo elemento. Veremos nessa aula como podemos implementar lógicas como *ngFor e *ngIf numa mesma situação.