0Pricing
Angular Academy · Aula

O que são sinais

Entenda sinais como contêineres de estado reativo.

O que são sinais é uma aula grátis de Angular Academy no CoddyKit. Esta é a aula 1 de 4. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de Angular Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de Angular Academy inclui 4 aulas no total.

O que são Signals?

Um signal é um primitivo reativo introduzido nas versões modernas do Angular. Ele é um invólucro em torno de um valor que pode notificar consumidores interessados quando esse valor muda.

Os Signals tornam a reatividade do Angular explícita, granular e fácil de compreender.

Por que a reatividade é importante

Em um framework de interface do usuário, a tela precisa permanecer sincronizada com seus dados. Quando os dados mudam, a visualização deve ser atualizada.

Os Signals oferecem ao Angular uma maneira precisa de saber exatamente o que mudou e do que isso depende, para que somente as partes afetadas da visualização sejam atualizadas.

O problema antes dos Signals

Antes, o Angular dependia do Zone.js e de uma detecção ampla de mudanças: após qualquer evento assíncrono, o Angular verificava novamente grandes partes da árvore de componentes.

Isso funciona, mas pode ser ineficiente. Os Signals permitem atualizações minuciosas sem verificar tudo.

Um Signal armazena um valor

Pense em um Signal como uma caixa inteligente ao redor de um valor. Você pode ler o que está dentro dele e substituir esse conteúdo.

A leitura de um Signal também registra quem está fazendo a leitura, para que os dependentes possam ser atualizados posteriormente.

import { signal } from '@angular/core';

const count = signal(0);
// count is now a signal holding the number 0

Ler é chamar uma função

Uma ideia fundamental: para ler um Signal, você o chama como uma função. Os parênteses são a forma de o Angular saber que você está lendo o valor atual.

const count = signal(0);
console.log(count()); // 0  <-- note the ()

Signals são síncronos

Ler um Signal é uma operação síncrona e sempre retorna imediatamente o valor atual. Não há inscrição, pipe assíncrono nem cancelamento manual de inscrição para gerenciar.

Gravável versus calculado

O Signal básico criado com signal() é gravável: você pode alterar seu valor.

Também existem Signals calculados (valores derivados) e efeitos (efeitos colaterais), que se baseiam em Signals graváveis.

Signals rastreiam dependências

Quando um valor calculado ou um modelo lê um Signal, o Angular registra essa dependência automaticamente.

Depois, se o Signal mudar, somente esses dependentes serão recalculados. É isso que torna os Signals eficientes.

Atualizações sem inconsistências

Os Signals são projetados para não apresentarem inconsistências: os consumidores sempre veem um valor consistente e não são notificados com um estado intermediário ou parcialmente atualizado.

Isso torna previsíveis os grafos reativos complexos.

Onde ficam os Signals

Os Signals fazem parte de @angular/core. Importe signal, computed e effect desse módulo.

Eles podem ser usados dentro de componentes, serviços ou qualquer código TypeScript.

import { signal, computed, effect } from '@angular/core';

Signals em um componente

Um padrão comum é declarar Signals como campos de uma classe em um componente e depois lê-los no modelo.

import { Component, signal } from '@angular/core';

@Component({ selector: 'app-counter', template: '' })
export class CounterComponent {
  count = signal(0);
}

Verificação rápida: conceitos básicos de Signals

Vamos verificar se você entendeu o que é um Signal.

Recapitulação: o que são Signals

Você aprendeu que um signal é um invólucro reativo em torno de um valor que notifica os consumidores quando há uma alteração. Você lê um Signal chamando-o com parênteses; as leituras são síncronas, e os Signals permitem atualizações minuciosas e sem inconsistências.

A seguir, você criará e lerá seus próprios Signals.

Perguntas Frequentes

A aula “O que são sinais” é grátis?

Sim — o texto completo de “O que são sinais” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de Angular Academy, atualize para CoddyKit PRO. O curso de Angular Academy inclui 4 aulas no total.

O que vou aprender em “O que são sinais”?

Entenda sinais como contêineres de estado reativo. Você pratica Angular Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.

Preciso ter experiência prévia para começar Angular Academy?

Nenhuma experiência prévia é necessária. Angular Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 1 de 4.

Quanto tempo leva a aula “O que são sinais”?

A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.

Posso escrever e executar código nesta aula de Angular Academy?

Sim. Cada aula de Angular Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.

Todas as aulas deste curso

  1. O que são sinais
  2. Criando e lendo sinais
  3. Atualizando sinais com set e update
  4. Sinais em modelos
← Voltar para Angular Academy