Overgang til Selvstændige Komponenter
Stryg for at vise menuen
I tidligere versioner af Angular skulle hver komponent være en del af et modul. Selv den simpleste komponent kunne ikke eksistere alene — den skulle erklæres i et NgModule.
Dette svarede til at skulle have et helt køkken bare for at lave en kop te. Det virker omstændeligt, ikke?
Derfor begyndte Angular-teamet over tid at forenkle strukturen. Dette førte til introduktionen af en ny tilgang — Standalone Components.
Hvad er en Standalone Component?
En Standalone Component er en komponent, der ikke kræver deklaration i et modul (NgModule). Den er selvstændig, hvilket betyder, at den indeholder alle oplysninger om sine afhængigheder i sig selv.
For at oprette en, tilføjes blot flaget standalone: true i @Component-dekorationen, og nødvendige afhængigheder angives med imports-arrayet:
example.ts
Her er tilføjelsen af standalone: true en særlig mulighed i @Component-dekorationen, som fortæller Angular, at denne komponent er uafhængig — den behøver ikke at blive erklæret i en NgModule.
Derudover angives en liste over eksterne afhængigheder (imports), som komponenten kræver. I den traditionelle modulbaserede tilgang blev disse afhængigheder videregivet til modulets imports. Men når komponenter fungerer uden et modul, skal deres afhængigheder erklæres direkte i komponenten — og Angular fungerer internt som et modul for den pågældende komponent.
Hvorfor bevæger Angular sig væk fra NgModules?
NgModules spillede en vigtig rolle i store applikationer:
-
De hjalp med at organisere koden;
-
De gav kontrol over omfang (synlighed);
-
De var nyttige til optimering.
Men med tiden blev det tydeligt, at mange af disse ting kan håndteres på komponentniveau — mere enkelt og intuitivt.
Angular har ikke fjernet moduler — standalone-komponenter tilbyder blot en mere fleksibel mulighed.
Med andre ord er standalone-komponenter den moderne måde at opbygge komponenter uden moduler på. De forenkler strukturen, gør komponenterne selvstændige og nemmere at anvende.
Angular understøtter fortsat moduler, men anbefaler at bruge standalone-komponenter til ny kode.
1. Hvad gør standalone: true i en komponent-decorator?
2. Hvorfor er egenskaben imports nødvendig i en Standalone Component?
Tak for dine kommentarer!
Spørg AI
Spørg AI
Spørg om hvad som helst eller prøv et af de foreslåede spørgsmål for at starte vores chat