Angular да ngOnDestroy хуки

ngOnDestroy хуки компонент ўчирилганда ишга тушади. Бу хукида ресурсларни бўшатиш, элементларнинг вокеаларга обуна бўлишни бекор қилиш, таймерларни тўхтатиш ва ҳ.к. амалларни бажариш мумкин.

Angular да компонентни яратиш ва ўчириш, ундaif шарти ёрдамида реактив ravishda кўрсатилиши ва бекитилиши билан содир бўлади. Яъни Angular компонентларни оддийгина бекитмай, балки уларни ўчириб, keyin қайтариб олади.

Шунингдек, компонентлар улар циклларда реактив ravishda қайтарилганда ҳам яратилади ва ўчирилади. Бунда ҳолда 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 ёрдамида реактив бўлган, воситасида фарзанд компонент кўрсатиладиган қилинг. Ўрганилган хукиинг ишлашини текширинг.

Ота-она компонентда фойдаланувчи исмларининг массиви берилган. Фарзанд компонентни фойдаланувчи билан яратинг. Массивни цикл билан қайтариб, фойдаланувчилар билан компонентларни чиқаринг. Массивдан элементлар ўчириладиган тугма ясанг. Фарзанд компонентларда ўчириш хуки ишга тушишини текширинг.