Хуки ngOnDestroy дар Angular

Хуки 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 реактиви созед, тавассути он компоненти фарзанд намоиш дода шавад. Коркарди хуки омӯхташударо санҷед.

Дар компоненти волидайн массиви номҳои корбарон дода шудааст. Компоненти фарзанд бо корбар созед. Массивро бо ҳалқа такрор кунед ва компонентҳоро бо корбарон бароваред. Тугмаеро созед, ки бо фишурдани он элементҳо аз массив нест карда шаванд. Санҷед, ки дар компонентҳои фарзанд хук барои нест кардан кор мекунад.