Nini Angular Signals?

Question

Accepted Answer

**Signals** ni primitive ya reactivity ya Angular (iliongezwa katika Angular 16+) kwa usimamizi wa hali — mfuko mzunguko wa thamani ambayo **ilojifanya watumiaji wakati inabadilika**, kuwezesha sasisho safi na yenye ufanisi bila kutegemea kugundua mabadiliko ya Zone.js. ## Kuunda na kutumia signal ```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 }); } } ``` ## Kusoma signal: itaji kama kitendo ```html ``` Signals **zinasomwa kwa kuwaitisha** (`count()`), si kama sifa za kawaida. Kwenye template, Angular inafuatilia halisi ni signals gani view inasoma, kwa hivyo sehemu tu zinazoathiriwa zinabadilishwa wakati signal inabadilika. ## Aina tatu za signal ```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 ``` `computed` ni kila wakati na cached (kama Vue ya computed); `effect` inatenda athari za upande reactively (kama watcher). ## Kwa nini signals ni muhimu: reactivity ya kina ```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 ``` Signals inapatia Angular **ufuatiliaji wa tegemezi husika** — wakati signal inabadilika, views na computed tu ambazo zinasoma halisi zinabadilishwa. Hii ni efficient zaidi kuliko kugundua mabadiliko mapana ambayo Zone.js inasisimua, na ndiyo msingi wa kuondoa Zone.js kabisa (zoneless mode). ## Ingizo la signal (mpya) ```ts name = input(); // @Input as a signal name = input.required(); ``` ## Kwa nini ni muhimu Signals ni maendeleo ya karibuni makubwa zaidi katika reactivity ya Angular — mfano rahisi, wazi zaidi, na yenye ufanisi mkubwa zaidi kuliko kugundua mabadiliko implicita ya Zone.js. Zinawezesha sasisho safi, kupunguza ukaguzi wa kawaida, kuunganisha vizuri na computed/effect, na kuandaa njia kwa Angular bila zone. Kuelewa signals kuwa muhimu sana zaidi, kwani Angular inaongoza maendeleo mapya kuelekea kwao kama primitive ya hali ya kawaida.