Ciclo di vita di un'app Angular

In questo articolo vedremo la lista di eventi che viene emessa durante il caricamento di un componente, direttiva, o il cambio di un elemento di un form.

Ultimo aggiornamento: 7 giorni fa

Il caricamento di un'app Angular, presuppone il caricamento di N componenti, ognuno dei quali ha precisi "stati"  durante il ciclo di vita dell'intera app.

Ognuno di questi stati lo puoi pensare come alle fermate di un autobus, da un capolinea all'altro. Durante il percorso, io posso entrare nell'autobus, in diversi momenti corrispondenti alle diverse fermate. Nel caso di un'app Angular, tutto è gestito in automatico, e queste "fermate" sono predefinite e ci permettono di entrare o agganciarci a diversi stati di esecuzione di un'app.

Sappiamo infatti dai capitoli precedenti, che il cuore di ogni componente è costituito dal corpo della classe stessa, dove si inserisce la logica del componente. Come ogni classe, ci sarà il costruttore, dove per convenzione ed efficienza, si inizializzano le eventuali proprietà del componente.

Il costruttore quindi è proprio il primo elemento che viene richiamato all'atto del caricamento del componente.

Questo è il motivo per cui, nel caso il componente dovesse dipendere da altri elementi, si sfrutta il costruttore per "iniettano" le dipendenze.

Ad esempio, quando un componente o service ha la necessità di comunicare con la rete, dovremo iniettare nel costruttore un service di nome http, grazie al quale potremo accedere ad una serie di metodi della libreria Http, utili per dialogare con la rete.

Ecco allora la lista degli eventi principali, che nel corso dello sviluppo di un'app, potrai sfruttare per effettuare degli interventi sui dati o sulla logica gestita dal componente. E' chiaro che per poterli utilizzare, dovrai implementarli nel costruttore del componente che necessita di "agganciarsi" a tali eventi, e includerli  nel componente richiamandoli dalla libreria @angular/core

ngOnInit
Il metodo ngOnInit del componente è chiamato subito dopo l'esecuzione del costruttore e prima che venga emesso ngOnChanges, per...

Ohps... scusami la fastidiosa interruzione, ma per questioni gestionali, tutti i tutorial completi gli ho spostati a questo link: WEBSU. Risulterà più semplice anche per te seguirli e chiedermi dei consigli. Ti aspetto, dai... bastano 5 secondi. Non buttare tutto lo sforzo fatto per arrivare qui.

Hai tempo per leggere? Angular

Non farti scappare il mio libro appena aggiornato: "Angular 100% Operativo". Un corso completo su Angular per imparare rapidamente le tecniche per creare WebAPP e non solo. Prenotalo cliccando l'immagine qui sotto

Categoria: Angular