Skip to main content

In what order are the lifecycle hooks called?

The order in which Angular calls the lifecycle hooks for a component:

Call order

  1. ngOnChanges(changes) - called when the input data (@Input) changes, before the component is initialized.
  2. ngOnInit() - once, after the input properties are first initialized.
  3. ngDoCheck() - after ngOnInit, on every Angular change detection check.
  4. ngAfterContentInit() - after the projection of external content (<ng-content>), once.
  5. ngAfterContentChecked() - after every check of the projected content.
  6. ngAfterViewInit() - after the component's view and its child components are initialized, once.
  7. ngAfterViewChecked() - after every check of the component's view and child components.
  8. ngOnDestroy() - before the component is destroyed.

So the sequence is:

ngOnChanges → ngOnInit → ngDoCheck → ngAfterContentInit → ngAfterContentChecked → ngAfterViewInit → ngAfterViewChecked → ngOnDestroy

If the input data changes after initialization, ngOnChanges and ngDoCheck can be called multiple times, while the other hooks (After*) are called after every content or view check.

Short Answer

Interview ready
Premium

A concise answer to help you respond confidently on this topic during an interview.