Angular Renderer2 删除监听器

Angular中使用Renderer2删除事件监听器的方法

typescript
import { Component, ElementRef, Renderer2, OnInit } from '@angular/core';
@Component({
  selector: 'app-example',
  template: '点击我',
})
export class ExampleComponent implements OnInit {
  constructor(private renderer: Renderer2, private el: ElementRef) {}
  ngOnInit() {
    // 步骤1: 获取元素引用
    const button = this.el.nativeElement.querySelector('#myButton');
    // 步骤2: 添加事件监听器
    const clickListener = this.renderer.listen(button, 'click', () => {
      console.log('按钮被点击了！');
    });
    // 在一定条件下，删除事件监听器
    if (someCondition) {
      // 删除事件监听器
      this.renderer.removeEventListener(button, 'click', clickListener);
    }
  }
}