Angular: 26. Ciclo de vida de un componente

En Angular, los componentes tienen un ciclo de vida, es decir, una serie de funciones por defecto que son llamadas en un determinado momento.

Después de crear un componente/directiva llamando a su constructor, Angular llama a los métodos de enlace del ciclo de vida en la siguiente secuencia en momentos específicos:



ngOnChanges(): responde cuando Angular (re)establece las propiedades de entrada enlazadas a datos. El método recibe un objeto SimpleChanges de valores de propiedad actuales y anteriores.
Se llama antes de ngOnInit() y siempre que cambian una o más propiedades de entrada enlazadas a datos.

ngOnInit(): inicializa la directiva/componente después de que Angular primero muestre las propiedades enlazadas a datos y establezca las propiedades de entrada de la directiva/componente.
Llamado una vez, después de la función ngOnChanges().

ngDoCheck(): detecta y actúa sobre cambios que Angular no puede o no quiere detectar por sí solo.
Llamado durante cada ejecución de detección de cambios, inmediatamente después de ngOnChanges() y ngOnInit().

ngAfterContentInit(): responde después de que Angular proyecta contenido externo en la vista del componente/vista en la que se encuentra una directiva.
Llamado una vez después de ngDoCheck().

ngAfterContentChecked(): responde después de que Angular verifique el contenido proyectado en la directiva/componente.
Llamado después de ngAfterContentInit() y cada ngDoCheck() subsiguiente.

ngAfterViewInit(): responde después de que Angular inicialice las vistas del componente y las vistas secundarias/vista en la que se encuentra una directiva.
Llamado una vez después de ngAfterContentChecked().

ngAfterViewChecked(): responde después de que Angular verifique las vistas del componente y las vistas secundarias/vista en la que se encuentra una directiva.
Llamado después de ngAfterViewInit() y todos los ngAfterContentChecked() subsiguientes.

ngOnDestroy(): limpieza justo antes de que Angular destruya la directiva/componente. Anula la suscripción de observables y separa los controladores de eventos para evitar pérdidas de memoria.
Llamado justo antes de que Angular destruya la directiva/componente.

Y eso es todo.