Angular полное уничтожение динамически созданного компонента

Я создаю множество динамических компонентов, используя:

this.factory = this.componentFactoryResolver.resolveComponentFactory(SliderComponent);
this.sliderComponentReference = viewContainerRef.createComponent(this.factory);

Когда мне нужно уничтожить компонент, я вызываю метод destroy:

this.sliderComponentReference.destroy();

Я понимаю, что он удалил динамический компонент из представления и его экземпляра, однако, когда я просматриваю переменную сразу после того, как замечаю, что в ней все еще есть информация:

changeDetectorRef: ViewRef_ {_view: {…}, _viewContainerRef: ViewContainerRef.. }
componentType:(...)
hostView: ViewRef_ {_view: {…}, _viewContainerRef: ViewContainerRef... }}
injector:(...)

Вопросов:

  1. Почему переменная все еще имеет ссылку на экземпляр компонента, если он был уничтожен?

  2. Компонент все еще хранится в памяти? Если да, можно ли его восстановить?

Под "просмотреть переменную сразу после" вы имеете в виду this.sliderRef.destroy(); console.log(this.sliderRef)?

Explosion Pills 13.09.2018 18:23

Я создал этот Демо StackBlitz, чтобы любой заинтересованный мог увидеть пример работающего кода того, о чем говорит OP.

Narm 13.09.2018 18:31
5
2
1 590
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вы можете увидеть определение ссылки компонента здесь: https://github.com/angular/angular/blob/master/packages/core/src/view/refs.ts#L103 - он имеет свойства changeDetectorRef, hostView и т. д. Когда вы вызываете .destroy, он вызывает базовый метод viewRef.destroy: https://github.com/angular/angular/blob/master/packages/core/src/view/refs.ts#L277

Это заканчивается вызовом других методов, но, похоже, на самом деле это не перезаписывает какие-либо свойства, которые уже были определены в компоненте ref. Насколько я знаю в JavaScript, объект не может удалить себя. Вы можете удалить только свойства объекта со ссылкой на этот объект.

Компонент по-прежнему хранится в памяти, и в некотором смысле его можно использовать. Однако это может работать не так, как вы ожидаете, из-за того, что делает .destroy. Возможно, вы сможете воссоздать его ... и есть методы attach. JavaScript выполняет свою собственную сборку мусора / управление памятью, поэтому вы не можете принудительно удалить эти элементы из памяти. Если JavaScript обнаруживает, что ссылка больше не доступна для каких-либо указателей во время цикла сборки мусора, он освобождает эту память.

let componentRef = this.componentFactoryResolver.resolveComponentFactory (cmptNa‌ me) .create (this.inje‌ ctor); this.dynamicCo‌ mponentContainer.ins‌ ert (componentRef.hos‌ tView); Я сохраняю componentRef в массиве, скажем, в переменной 'componentTracker', и у нас есть 3 компонента в DOM. Можем ли мы уничтожить конкретный компонент, используя ссылку, хранящуюся в 'componentTracker', то есть this.componentTracker [i] .destroy ();

Mahi 13.05.2019 11:42

Другие вопросы по теме