Angular-এ ngOnDestroy হুক
ngOnDestroy হুকটি কম্পোনেন্ট সরানো হলে
সক্রিয় হয়। এই হুকে, আপনি রিসোর্স মুক্ত করতে পারেন,
এলিমেন্ট ইভেন্টের সাবস্ক্রিপশন বাতিল করতে পারেন,
টাইমার মুক্ত করতে পারেন ইত্যাদি।
Angular-এ একটি কম্পোনেন্ট তৈরি এবং সরানো হয়
যখন এটি if শর্ত ব্যবহার করে প্রতিক্রিয়াশীলভাবে দেখানো
এবং লুকানো হয়। অর্থাৎ, Angular কেবল কম্পোনেন্টগুলি লুকায় না,
বরং সেগুলি সরায় এবং আবার ফিরিয়ে আনে।
কম্পোনেন্টগুলি তৈরি এবং সরানো হয়, যখন সেগুলি লুপে প্রতিক্রিয়াশীলভাবে পুনরাবৃত্তি করা হয়। এই ক্ষেত্রে, Angular কম্পোনেন্টগুলি তৈরি এবং সরায়।
চলুন অনুশীলনে চেষ্টা করি। OnDestroy
ইন্টারফেসটি ইম্পোর্ট করি:
import { OnDestroy } from '@angular/core';
এটি ক্লাসের সাথে সংযুক্ত করি:
export class UserComponent implements OnDestroy {
}
এখন আমাদের হুকটি লিখি:
export class UserComponent implements OnDestroy {
constructor() {
console.log('constructor is started');
}
ngOnDestroy() {
console.log('onDestroy is applied');
}
}
একটি প্রতিক্রিয়াশীল if তৈরি করুন যার সাহায্যে
একটি চাইল্ড কম্পোনেন্ট দেখানো হবে। শেখা হুকটির
কাজ পরীক্ষা করুন।
প্যারেন্ট কম্পোনেন্টে ব্যবহারকারীর নামের একটি অ্যারে দেওয়া আছে। ব্যবহারকারী সহ একটি চাইল্ড কম্পোনেন্ট তৈরি করুন। অ্যারেটি লুপ করে পুনরাবৃত্তি করুন এবং ব্যবহারকারী সহ কম্পোনেন্টগুলি আউটপুট করুন। একটি বাটন তৈরি করুন, যেটি ক্লিক করলে অ্যারে থেকে এলিমেন্ট মুছে যাবে। পরীক্ষা করুন যে চাইল্ড কম্পোনেন্টগুলিতে মুছে ফেলার হুকটি সক্রিয় হবে কিনা।
