Mit jelent az Angular Signals?

Question

Accepted Answer

**A Signals** az Angular reaktív primitívje (Angular 16+ verzióban hozzáadva) az állapotkezeléshez — egy érték körüli wrapper, amely **értesíti a fogyasztókat, amikor megváltozik**, lehetővé téve a részletgazdagságú, hatékony frissítéseket a Zone.js változásdetektálásra való támaszkodás nélkül. ## Szignál létrehozása és használata ```ts import { signal, computed, effect } from "@angular/core"; export class CounterComponent { count = signal(0); // a writable signal double = computed(() => this.count() * 2); // derived signal (auto-updates) increment() { this.count.set(this.count() + 1); // set a new value this.count.update(c => c + 1); // or update based on current } constructor() { effect(() => { console.log(`count is now ${this.count()}`); // re-runs when count changes }); } } ``` ## Szignál olvasása: hívja meg függvényként ```html ``` Vegye figyelembe, hogy a szignálok **függvényként való meghívással olvashatók** (`count()`), nem egyszerű tulajdonságként. A sablonban az Angular pontosan követi, hogy a nézet mely szignálokat olvassa, így csak az érintett részek frissülnek, amikor egy szignál megváltozik. ## A három szignál típus ```text signal(value) → writable state, updated via .set() / .update() computed(() => ...) → derived/cached value; auto-recomputes when its deps change effect(() => ...) → runs a side effect whenever read signals change ``` A `computed` lusta és gyorsítótárazott (mint a Vue-ban); az `effect` reaktívan futtat mellékhatásokat (mint egy watcher). ## Miért számítanak a szignálok: részletgazdagságú reaktivitás ```text Traditional Angular: a change triggers checking the WHOLE component tree (Zone.js) Signals: Angular knows EXACTLY which views depend on a changed signal → update only those → far more efficient, and enables "zoneless" Angular ``` A szignálok az Angularnak **pontos függőségkövetést** biztosítanak — amikor egy szignál megváltozik, csak az olyan nézetek és computerék frissülnek, amelyek valóban olvassák azt. Ez hatékonyabb, mint a Zone.js által kiváltott széles körű változásdetektor, és az alapja annak, hogy teljesen eltávolítsuk a Zone.js-t (zoneless mód). ## Szignál alapú inputok (újabb) ```ts name = input(); // @Input as a signal name = input.required(); ``` ## Miért számít A szignálok az Angular reaktivitásának legjelentősebb közelmúltbeli fejlődése — egyszerűbb, explicit, és sokkal hatékonyabb modell, mint az implicit Zone.js változásdetektor. Lehetővé teszik a részletgazdagságú frissítéseket, csökkentik a szükségtelen ellenőrzéseket, tisztán integrálódnak a computed/effect-tel, és előkészítik az utat az Arizona zoneless felé. A szignálok megértése egyre fontosabb, mivel az Angular az új fejlesztést felé irányítja őket az alapértelmezett állapot primitívként.