Lifecycle Hooks in Angular

From the Angular cheat sheet · Components · verified Jul 2026

Lifecycle Hooks

Component lifecycle methods

typescript
export class MyComponent implements OnInit, OnDestroy {
  // 1. Constructor
  constructor() { }

  // 2. OnChanges
  ngOnChanges(changes: SimpleChanges) { }

  // 3. OnInit
  ngOnInit() { }

  // 4. DoCheck
  ngDoCheck() { }

  // 5. AfterContentInit
  ngAfterContentInit() { }

  // 6. AfterContentChecked
  ngAfterContentChecked() { }

  // 7. AfterViewInit
  ngAfterViewInit() { }

  // 8. AfterViewChecked
  ngAfterViewChecked() { }

  // 9. OnDestroy
  ngOnDestroy() { }
}
💡 Use ngOnInit for initialization, not constructor
⚡ Always unsubscribe in ngOnDestroy to prevent memory leaks
📌 ngAfterViewInit is safe for DOM manipulation
🔥 Avoid heavy operations in frequently called hooks

More Angular tasks

Back to the full Angular cheat sheet