Introduktion til signaler: Angulars nye primitiv for reaktivitet

Den 15. februar 2023 introducerede Angulars team Signals til rammen med en simpel pull-anmodning. Siden da har der været ivrige diskussioner i Angular-samfundet om dets brug og fordele. Mange er endda begyndt at lave prototyper med signaler for at afprøve dens funktionalitet.

Lad os tage et kig på, hvordan denne nye funktion fungerer, dens syntaks, og hvordan man bruger den, når den er fuldt udrullet.

Hvad er signaler?

Signaltypen er Angulars nye reaktive primitive type. Dens formål er at holde en værdi, ligesom en standardvariabel, men det kendetegn ved et signal er dets unikke adfærd. Hvis et signal ændres, vil det give besked om alt, der afhænger af det.

Derudover kan Angular bruge signaler som den nye tilgang til at detektere og udløse ændringer i stedet for den nuværende standardmetode med beskidt kontrol af hele komponenttræet.

Sådan bruges signaler i vinkel

Et signal vil se sådan her ud:

@Komponent





instagram viewer
({
 vælger: 'min-app',
 selvstændig: rigtigt,
 skabelon: `
 Antal: {{ count() }} </div>
 Dobbelt: {{ double() }} </div>
"changeCount()"></button>
`,
})
eksportklasse AppComponent{
 tælle = signal(0)
 dobbelt = beregnet(() =>det her.count() * 2);

 changeCount() {
det her.count.set(5)
 }
}

I denne app-komponent er det variable antal et signal initialiseret med værdien nul. count refereres derefter inde i double (en beregnet værdi) og skabelonen. Så når et klik på knappen sætter værdien af ​​tæller til fem, opdateres både den beregnede værdi (dobbelt) og værdierne i skabelonen.

Hver del af Kantet komponent der afhænger af signalet vil automatisk blive opdateret, når værdien ændres.

Hvorfor introduktionen af ​​signaler er vigtig

Signaler gør det nemmere at lære og arbejde med Angular. Skift til signaler som den nye standard måde at lære og bygge med Angular vil harmonisere læringsprocessen. Uanset om vi foretrækker en mere imperativ kodningsstil med Angular, eller ønsker at lære en mere deklarativ kodningsstil.

De fleste mennesker begynder at kode tvingende nødvendigt, fordi det generelt er mere intuitivt og velkendt for folk. Men at skifte fra den imperative tilgang til den deklarative måde involverer et paradigmeskifte og en total ændring i vores mentale model. Det er derfor, RX.js, det reaktive bibliotek, er svært at lære for mange.

Signaler vil bringe disse to separate tilgange sammen. Alle kan lære signaler som standard, begynde at lære begreberne bag reaktivitet og ikke engang bekymre sig om at inkorporere Angulars RX.js hvis de ikke kan eller vil.

Når du er fortrolig med grundlæggende i Angular og ønsker at skifte til en mere deklarativ kodningsstil, kan du nemt tilføje RX.js til de begreber, du allerede forstår.

Signaler bør forbedre vinkelprogrammering for alle

Signals er Angulars nye reaktive mekanisme, som du kan bruge til at skabe reaktive værdier, som forbrugerne kan læse. Et signal giver straks alle forbrugere besked, når dets værdi ændres. Signaler harmoniserer læreprocessen i Angular ved at samle de imperative og deklarative tilgange til kodning.

Angular vil stole på signaler for at gøre ændringsdetektion mere let og robust. Derfor vil det at lære at bruge signaler som Angular-udvikler give dig et fastere greb om reaktivitet i Angular og gøre dig til en bedre udvikler. Glem ikke at mestre det grundlæggende i Angular, før du lærer de mere avancerede dele.