Saltar al contenido

3 Angular.js: Hooks más importantes

    Vamos a empezar ha hablar de los tres Hooks más importantes de angular.js OnInit, DoCheck, OnDestroy.

    OnInit

    Es el ciclo de vida que se llama después de que Angular haya inicializado todas las propiedades vinculadas a datos de una directiva.

    interface OnInit {
      ngOnInit(): void
    }

    DoCheck

    Es el ciclo de vida que invoca una función de detección de cambios personalizada para una directiva, además de la verificación realizada por el detector de cambios predeterminado.

    interface DoCheck {
      ngDoCheck(): void
    }

    OnDestroy

    Es el ciclo de vida que se llama cuando se destruye una directiva, tubería o servicio.

    interface OnDestroy {
      ngOnDestroy(): void
    }

    Ejemplo más práctico

    Para comprender un poco más la funcionalidad de los hooks de angular.js, que mejor que un buen ejemplo.

    import { Component, OnInit, DoCheck, OnDestroy } from '@angular/core';
    
    @Component({
        selector: 'componente',
        templateUrl: './componente.component.html'
    })
    export class ComponenteComponent implements OnInit, DoCheck, OnDestroy {
    
        ngOnInit(){
            console.log("OnInit ejecutado");
        }
    
        ngDoCheck(){
            console.log("DoCheck ejecutado");
        }
    
        ngOnDestroy(){
            console.log("OnDestroy ejecutado");
        }
        
    }