Angular Academy · Aula

Atualizando sinais com set e update

Altere valores de sinais de forma reativa.

Atualizando sinais com set e update é uma aula grátis de Angular Academy no CoddyKit. Esta é a aula 3 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.

Alterando um Signal

Um Signal gravável pode ser alterado de duas formas: set() substitui o valor, e update() deriva um novo valor a partir do valor atual.

Usando set()

set(newValue) substitui completamente o valor do Signal pelo valor que você passar.

const c = signal(0);
c.set(1);
console.log(c()); // 1

Quando usar set()

Use set() quando o novo valor não depender do anterior, por exemplo, ao atribuir um novo valor proveniente da entrada do usuário ou de uma resposta da API.

const name = signal('');
name.set('Alice');
console.log(name()); // Alice

Usando update()

update(fn) recebe uma função que recebe o valor atual e retorna o novo valor. É ideal quando o próximo valor depende do anterior.

const c = signal(0);
c.update(v => v + 1);
console.log(c()); // 1

Incrementando com update()

O contador clássico usa update() para incrementar com base na contagem existente.

const count = signal(10);
count.update(v => v + 1); // 11
count.update(v => v - 1); // 10

Atualizando objetos imutavelmente

Como a detecção de mudanças compara referências, substitua os objetos em vez de alterá-los. Espalhe o valor antigo em um novo objeto.

const point = signal({ x: 0, y: 0 });
point.update(p => ({ ...p, x: p.x + 1 }));
console.log(point()); // { x: 1, y: 0 }

Atualizando matrizes imutavelmente

Para matrizes, retorne uma nova matriz. Evite usar push/splice na matriz existente; use a sintaxe de espalhamento ou métodos de matriz que retornem novas matrizes.

const items = signal<string[]>(['a']);
items.update(arr => [...arr, 'b']);
console.log(items()); // ['a', 'b']

Resumo de set() versus update()

set: você já tem o valor final. update: você calcula o valor final a partir do valor atual. Ambos notificam os consumidores se o valor realmente mudar.

Igualdade de referências e alterações

Por padrão, os Signals usam a igualdade de referências (ou de valores, no caso de primitivos) para decidir se algo mudou. Definir um Signal com exatamente o mesmo valor primitivo não notifica os dependentes.

const c = signal(5);
c.set(5); // no change, dependents not notified

Alterações diretas não são recomendadas

APIs mais antigas tinham um método mutate(), mas a abordagem moderna recomendada é usar atualizações imutáveis com set() e update(), retornando novas referências.

Atualizando Signals em métodos

Em componentes, envolva as atualizações de Signals em métodos que o modelo possa chamar a partir de manipuladores de eventos.

export class CounterComponent {
  count = signal(0);
  increment() { this.count.update(v => v + 1); }
  reset() { this.count.set(0); }
}

Verificação rápida: set vs update

Escolha a ferramenta certa para a tarefa.

Recapitulação: atualizando Signals

Você aprendeu a usar set() para substituir um valor e update(fn) para derivar um novo valor a partir do atual. Você também viu como atualizar objetos e matrizes de forma imutável para que a igualdade de referência detecte a alteração. A seguir: usando Signals diretamente em templates.

Perguntas Frequentes

A aula “Atualizando sinais com set e update” é grátis?

Sim — o texto completo de “Atualizando sinais com set e update” é 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 “Atualizando sinais com set e update”?

Altere valores de sinais de forma reativa. 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 3 de 4.

Quanto tempo leva a aula “Atualizando sinais com set e update”?

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

O que são sinais
Criando e lendo sinais
Atualizando sinais com set e update
Sinais em modelos

← Voltar para Angular Academy