Transizione ai Componenti Standalone
Nelle versioni precedenti di Angular, ogni componente doveva far parte di un modulo. Anche il componente più semplice non poteva esistere da solo — doveva essere dichiarato all'interno di un NgModule.
Era come aver bisogno di una cucina intera solo per preparare una tazza di tè. Sembra ingombrante, vero?
Per questo motivo, nel tempo, il team di Angular ha iniziato a semplificare la struttura. Questo ha portato all'introduzione di un nuovo approccio — Componenti Standalone.
Che cos'è un Componente Standalone?
Un Componente Standalone è un componente che non richiede la dichiarazione all'interno di un modulo (NgModule). È autonomo, il che significa che contiene tutte le informazioni sulle sue dipendenze al proprio interno.
Per crearne uno, è sufficiente aggiungere il flag standalone: true all'interno del decoratore @Component e specificare eventuali dipendenze necessarie utilizzando l'array imports:
example.ts
Qui, l'aggiunta di standalone: true rappresenta un'opzione speciale all'interno del decoratore @Component che indica ad Angular che questo componente è indipendente — non necessita di essere dichiarato in un NgModule.
Inoltre, viene specificato un elenco di dipendenze esterne (imports) richieste dal componente. Nell'approccio tradizionale basato sui moduli, queste dipendenze venivano passate agli imports del modulo. Tuttavia, quando i componenti funzionano senza un modulo, le loro dipendenze devono essere dichiarate direttamente all'interno del componente — e Angular agisce internamente come modulo per quel componente.
Perché Angular si sta allontanando dagli NgModules?
Gli NgModules hanno svolto un ruolo importante nelle applicazioni di grandi dimensioni:
-
Hanno aiutato a organizzare il codice;
-
Hanno fornito controllo sull'ambito (visibilità);
-
Sono stati utili per l'ottimizzazione.
Ma col tempo è diventato chiaro che molte di queste funzionalità possono essere gestite a livello di componente — in modo più semplice e intuitivo.
Angular non ha rimosso i moduli — i componenti standalone offrono semplicemente un'opzione più flessibile.
In altre parole, i componenti standalone rappresentano il modo moderno di creare componenti senza moduli. Semplificano la struttura, rendono i componenti autosufficienti e più facili da utilizzare.
Angular continua a supportare i moduli ma raccomanda l'uso dei componenti standalone per il nuovo codice.
1. Cosa fa standalone: true in un decoratore di componente?
2. Perché la proprietà imports è necessaria in un componente Standalone?
Grazie per i tuoi commenti!
Chieda ad AI
Chieda ad AI
Chieda pure quello che desidera o provi una delle domande suggerite per iniziare la nostra conversazione
Awesome!
Completion rate improved to 3.13Transizione ai Componenti Standalone
Scorri per mostrare il menu
Nelle versioni precedenti di Angular, ogni componente doveva far parte di un modulo. Anche il componente più semplice non poteva esistere da solo — doveva essere dichiarato all'interno di un NgModule.
Era come aver bisogno di una cucina intera solo per preparare una tazza di tè. Sembra ingombrante, vero?
Per questo motivo, nel tempo, il team di Angular ha iniziato a semplificare la struttura. Questo ha portato all'introduzione di un nuovo approccio — Componenti Standalone.
Che cos'è un Componente Standalone?
Un Componente Standalone è un componente che non richiede la dichiarazione all'interno di un modulo (NgModule). È autonomo, il che significa che contiene tutte le informazioni sulle sue dipendenze al proprio interno.
Per crearne uno, è sufficiente aggiungere il flag standalone: true all'interno del decoratore @Component e specificare eventuali dipendenze necessarie utilizzando l'array imports:
example.ts
Qui, l'aggiunta di standalone: true rappresenta un'opzione speciale all'interno del decoratore @Component che indica ad Angular che questo componente è indipendente — non necessita di essere dichiarato in un NgModule.
Inoltre, viene specificato un elenco di dipendenze esterne (imports) richieste dal componente. Nell'approccio tradizionale basato sui moduli, queste dipendenze venivano passate agli imports del modulo. Tuttavia, quando i componenti funzionano senza un modulo, le loro dipendenze devono essere dichiarate direttamente all'interno del componente — e Angular agisce internamente come modulo per quel componente.
Perché Angular si sta allontanando dagli NgModules?
Gli NgModules hanno svolto un ruolo importante nelle applicazioni di grandi dimensioni:
-
Hanno aiutato a organizzare il codice;
-
Hanno fornito controllo sull'ambito (visibilità);
-
Sono stati utili per l'ottimizzazione.
Ma col tempo è diventato chiaro che molte di queste funzionalità possono essere gestite a livello di componente — in modo più semplice e intuitivo.
Angular non ha rimosso i moduli — i componenti standalone offrono semplicemente un'opzione più flessibile.
In altre parole, i componenti standalone rappresentano il modo moderno di creare componenti senza moduli. Semplificano la struttura, rendono i componenti autosufficienti e più facili da utilizzare.
Angular continua a supportare i moduli ma raccomanda l'uso dei componenti standalone per il nuovo codice.
1. Cosa fa standalone: true in un decoratore di componente?
2. Perché la proprietà imports è necessaria in un componente Standalone?
Grazie per i tuoi commenti!
