Angular Renderer2 - destroy（）如何工作？

Question

Angular Renderer2的destroy（）方法如何工作？

import { Directive, ElementRef, Renderer2, OnInit } from '@angular/core'

@Directive({
  selector: '[destroy]'
})

export class Destroy implements OnInit {
  constructor(private elRef: ElementRef, private renderer: Renderer2) {}

  ngOnInit(){
    const currentElement = this.elRef.nativeElement;
    const nextEl = this.renderer.nextSibling(currentElement);
    this.renderer.addClass(nextEl, 'red');
    this.renderer.destroy();
  }   


}

在这里，我希望destroy（）完全符合angular.io所说的：

Implement this callback to destroy the renderer or the host element.

然后我在destroy（）之后添加这两行，并且setStyle方法适用于这两个元素。

  ngOnInit(){
    const currentElement = this.elRef.nativeElement;
    const nextEl = this.renderer.nextSibling(currentElement);
    this.renderer.addClass(nextEl, 'red');
    this.renderer.destroy();
    this.renderer.setStyle(currentElement, 'background-color', 'blue')
    this.renderer.setStyle(nextEl, 'background-color', 'blue')    
  }   

我希望这些方法在destroy之后不起作用，因为我希望主机元素或渲染器被销毁。

我错过了什么？

Stackblitz示例：

https://stackblitz.com/edit/angular-82bgqz?embed=1&file=src/app/destroy.directive.ts

Answer 1

对于DOM渲染器， destroy()是一个不执行任何操作的空方法：

destroy(): void {}

它只是DOM API的一个薄包装器。

如果你想要实现自己的自定义渲染器，销毁它可能会更有意义。