Angular ရှိ ngOnDestroy Hook

Hook ngOnDestroy သည် Component ဖယ်ရှားခံရသောအခါတွင် အလုပ်လုပ်သည်။ ဤ hook ထဲတွင် Resource များကို လွှတ်ပေးခြင်း၊ Element အချို့၏ Event များအား Subscribe လုပ်ထားခြင်းကို ဖျက်သိမ်းခြင်း၊ Timer များကို ရပ်တန့်ခြင်းစသည့် လုပ်ဆောင်ချက်များ လုပ်ဆောင်နိုင်သည်။

Angular ထဲတွင် Component ဖန်တီးခြင်းနှင့် ဖျက်သိမ်းခြင်းသည် ၎င်း Component အား if အခြေအနေတစ်ခုဖြင့် Reactively ပြသခြင်း၊ ဝှက်ထားခြင်း ပြုလုပ်သောအခါ ဖြစ်ပေါ်သည်။ ဆိုလိုသည်မှာ Angular သည် Component များကို ရိုးရိုးဝှက်ထားခြင်းမဟုတ်ဘဲ ၎င်းတို့ကို ဖျက်သိမ်းပြီး နောက်တစ်ကြိမ် ပြန်လည်ပြသသည့်အခါ ပြန်လည်ဖန်တီးပေးခြင်းဖြစ်သည်။

ထို့အပြင် Component များကို Loop များထဲတွင် Reactive အနေဖြင့် ဖြတ်သန်းပြသောအခါတွင်လည်း ဖန်တီးခြင်းနှင့် ဖျက်သိမ်းခြင်းများ ဖြစ်ပေါ်သည်။ ဤသို့သောအခြေအနေတွင် Angular သည် Component များကို ဖန်တီးခြင်းနှင့် ဖျက်သိမ်းခြင်းများ ပြုလုပ်သည်။

လက်တွေ့စမ်းကြည့်ကြရအောင်။ Interface OnDestroy ကို Import လုပ်ပါမည်။

app/user/user.component.tsimport { OnDestroy } from '@angular/core';

၎င်းကို Class နှင့် ချိတ်ဆက်ပါမည်။

app/user/user.component.tsexport class UserComponent implements OnDestroy {
  
}

ယခု ကျွန်ုပ်တို့၏ Hook ကို ရေးသားကြပါစို့။

app/user/user.component.tsexport class UserComponent implements OnDestroy {
  constructor() {
    console.log('constructor is started');
  }
  
  ngOnDestroy() {
    console.log('onDestroy is applied');
  }
}