Pular para conteúdo

Exercícios: Aula 04 📝

Pratique a manipulação do DOM com diretivas.

Básico

  1. ngIf: Crie um botão "Exibir Detalhes". Ao clicar, um parágrafo de texto deve aparecer ou desaparecer da tela usando *ngIf.
  2. ngFor: Crie um array de strings chamado habilidades. Use o *ngFor para listar essas habilidades em uma lista não ordenada (<ul>).

Intermediário

  1. ngClass: Crie uma variável importante (boolean). Use a diretiva ngClass para aplicar a classe CSS .texto-vermelho a um elemento apenas quando importante for verdadeiro.
  2. ngStyle: Crie um controle de "Tamanho do Texto" (um input range). Use ngStyle para que o tamanho da fonte de um parágrafo mude conforme o valor do input.

Desafio

  1. Filtro Simples: Crie uma lista de números de 1 a 10. Use o *ngFor para exibir os números, mas adicione um *ngIf interno (em um container ou elemento) para que apenas os números pares sejam mostrados na lista final.