Thuta Learning
BasicWeb Developmentintermediate

Lifecycle Hooks

Relax. We'll talk through this in plain words — no textbook voice.

Lifecycle Hooks are methods Angular provides so you can run code at each stage of a component's creation and destruction.

typescript
import { Component, OnInit, OnDestroy, OnChanges } from '@angular/core';

export class MyComponent implements OnInit, OnDestroy, OnChanges {
  
  // Component instance created လုပ်ပြီး properties initialized ဖြစ်သောအခါ
  constructor() {
    console.log('Constructor called');
  }
  
  // Component initialized ဖြစ်ပြီး @Input properties set ပြီးသောအခါ
  ngOnInit() {
    console.log('Component initialized');
    // API calls များ ဒီမှာလုပ်သင့်သည်
  }
  
  // @Input properties ပြောင်းလဲသောအခါတိုင်း
  ngOnChanges(changes: SimpleChanges) {
    console.log('Input changed:', changes);
  }
  
  // View initialized ဖြစ်ပြီးသောအခါ
  ngAfterViewInit() {
    console.log('View ready');
  }
  
  // Component destroy လုပ်မည့်အချိန်
  ngOnDestroy() {
    console.log('Component destroyed');
    // Cleanup: unsubscribe, clear timers
  }
}
You should see
(Console messages will appear at each stage of the component lifecycle)
Lifecycle Hooks | Thuta Learning