0Pricing
Angular Academy · Lezione

Aggiornamento dei signal con set e update

Modifichi reattivamente i valori dei signal.

Aggiornamento dei signal con set e update è una lezione Angular Academy gratuita su CoddyKit. Questa è la lezione 3 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento Angular Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso Angular Academy include 4 lezioni in totale.

Modifica di un signal

Un signal writable può essere modificato in due modi: set() sostituisce il valore, mentre update() ricava un nuovo valore da quello corrente.

Utilizzo di set()

set(newValue) sostituisce interamente il valore del signal con il valore passato.

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

Quando utilizzare set()

Utilizzi set() quando il nuovo valore non dipende da quello precedente, ad esempio per assegnare un nuovo valore proveniente dall'input dell'utente o dalla risposta di un'API.

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

Utilizzo di update()

update(fn) accetta una funzione che riceve il valore corrente e restituisce il nuovo valore. È ideale quando il valore successivo dipende da quello precedente.

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

Incremento con update()

Il contatore classico utilizza update() per incrementare il valore in base al conteggio esistente.

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

Aggiornamento immutabile degli oggetti

Poiché il rilevamento delle modifiche confronta i riferimenti, sostituisca gli oggetti invece di modificarli. Utilizzi lo spread del vecchio valore in un nuovo oggetto.

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

Aggiornamento immutabile degli array

Per gli array, restituisca un nuovo array. Eviti push/splice sull'array esistente; utilizzi lo spread o metodi degli array che restituiscono nuovi array.

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

Riepilogo di set() e update()

set: dispone già del valore finale. update: calcola il valore finale a partire da quello corrente. Entrambi notificano i consumer se il valore cambia effettivamente.

Uguaglianza dei riferimenti e cambiamenti

Per impostazione predefinita, i signal utilizzano l'uguaglianza dei riferimenti (o dei valori, per i primitivi) per determinare se è cambiato qualcosa. Impostare un signal sullo stesso identico valore primitivo non notifica le dipendenze.

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

La mutazione è sconsigliata

Le API precedenti includevano un metodo mutate(), ma l'approccio moderno consigliato consiste nell'utilizzare aggiornamenti immutabili con set() e update(), restituendo nuovi riferimenti.

Aggiornamento dei signal nei metodi

Nei componenti, racchiuda gli aggiornamenti dei signal in metodi che il template può chiamare dai gestori degli eventi.

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

Controllo rapido: set vs update

Scelga lo strumento giusto per il lavoro.

Riepilogo: aggiornamento dei Signals

Ha imparato a usare set() per sostituire un valore e update(fn) per ricavare un nuovo valore da quello corrente. Ha anche visto come aggiornare oggetti e array in modo immutabile, così che l'uguaglianza dei riferimenti rilevi la modifica. Prossimo argomento: usare i signals direttamente nei template.

Domande Frequenti

La lezione «Aggiornamento dei signal con set e update» è gratuita?

Sì — il testo completo di «Aggiornamento dei signal con set e update» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso Angular Academy, passa a CoddyKit PRO. Il corso Angular Academy include 4 lezioni in totale.

Cosa imparerò in «Aggiornamento dei signal con set e update»?

Modifichi reattivamente i valori dei signal. Eserciti Angular Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.

Ho bisogno di esperienza per iniziare Angular Academy?

Non è richiesta alcuna esperienza precedente. Angular Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 3 di 4.

Quanto tempo richiede la lezione «Aggiornamento dei signal con set e update»?

La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.

Posso scrivere ed eseguire codice in questa lezione Angular Academy?

Sì. Ogni lezione Angular Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.

Tutte le lezioni di questo corso

  1. Cosa sono i signal
  2. Creazione e lettura dei signal
  3. Aggiornamento dei signal con set e update
  4. Signal nei template
← Torna a Angular Academy