时间戳

首页 > 解决方案 > 当 Angular 指令创建元素时，是否有必要在 ngOnDestroy 中删除这些元素

angular - 当 Angular 指令创建元素时，是否有必要在 ngOnDestroy 中删除这些元素

问题描述

当 Angular 指令使用 renderer2 创建元素时，是否有必要在指令/主机被销毁时删除这些元素。


@Directive({
  selector: '[myDirective]'
})
...
constructor(private renderer: Renderer2,private hostElement: ElementRef){}
...
    const ele = this.hostElement.nativeElement;
    const span = this.renderer.createElement('span');
    this.renderer.appendChild(ele, span);
...

因为我使用的是renderer2，所以在没有我干预的情况下，我是否应该在后台处理所有这些，或者我应该添加对元素的引用并手动销毁它：

...
mySpan: HTMLElement;
constructor(private renderer: Renderer2,private hostElement: ElementRef){}
...
    const ele = this.hostElement.nativeElement;
    this.mySpan = this.renderer.createElement('span');
    this.renderer.appendChild(ele, span);
...
//is this required?
  ngOnDestroy() {
    if(this.mySpan){
        this.renderer.removeChild(this.hostElement.nativeElement, this.mySpan);
    }
  }

标签： angular

解决方案

正如@Indraraj26 提到的，没有必要删除从属性指令创建的孩子。您的主机组件将负责这一点。

在 - 方法中您需要注意的ngOnDestroy是（如果适用）：

  • 从 DOM 中移除监听器
  • 取消订阅 Observables

（可能还有一些情况，我现在想不出）

推荐阅读