0Pricing
Angular Academy · Lesson

AfterView and AfterContent Hooks

Run logic after view and content init.

View vs Content

Angular distinguishes a component view (its own template) from content projected into it via ng-content. Separate hooks fire for each.

AfterViewInit

The AfterViewInit hook runs once after the component view and its child views are fully initialized. It is the right time to access view children.

import { AfterViewInit } from "@angular/core";

export class DemoComponent implements AfterViewInit {
  ngAfterViewInit(): void {
    console.log("view ready");
  }
}

All lessons in this course

  1. ngOnInit and Initialization
  2. ngOnChanges and Input Changes
  3. ngOnDestroy and Cleanup
  4. AfterView and AfterContent Hooks
← Back to Angular Academy