Suggest an edit

Improve this article

Refine the answer for “In what order are the lifecycle hooks called?”. Your changes go to moderation before they’re published.

Approval required

Content

What you’re changing

Title (EN)

Short answer (EN)

Shown above the full answer for quick recall.

Answer (EN)

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.

Markdown · drag & drop images · ⌘B / ⌘I shortcuts155 words

For the reviewer

Note to the moderator (optional)

Visible only to the moderator. Helps review go faster.