Angular 2 lifecycle
Lifecycle
This is Component class topic.
Angular 2 class
Angular Reference explains more details. LIFECYCLE HOOKS
Example
lifecycle.component.ts
import { Component, OnInit, OnChanges, DoCheck, AfterContentInit, AfterContentChecked, AfterViewInit, AfterViewChecked, OnDestroy } from '@angular/core'; @Component({ selector: 'app', template: '<div>LifeCycle</div>' }) export class LifeCycleComponent implements OnInit { constructor() { console.log('constructor'); } ngOnChanges() { console.log('onChanges'); } ngOnInit() { console.log('onInit'); } ngDoCheck() { console.log('doCheck'); } ngAfterContentInit() { console.log('afterContentInit'); } ngAfterContentChecked() { console.log('contentChecked'); } ngAfterViewInit() { console.log('afterViewInit'); } ngAfterViewChecked() { console.log('afterViewChecked'); } ngOnDestroy() { console.log('onDestroy'); } }
Result
Check console.
constructor lifecycle.component.js:20 onInit lifecycle.component.js:23 doCheck lifecycle.component.js:26 afterContentInit lifecycle.component.js:29 contentChecked lifecycle.component.js:32 afterViewInit lifecycle.component.js:35 afterViewChecked lifecycle.component.js:23 doCheck lifecycle.component.js:29 contentChecked lifecycle.component.js:35 afterViewChecked