Question

我正在使用innerHTML绑定来创建动态a标签，如以下代码所示：

<span *ngIf="msg" [innerHTML]="msg | sanitizeHtml"></span>

在.ts中，我尝试使用addEventListerner添加点击事件：

ngAfterViewInit() {
 this.elements = this.elem.nativeElement.querySelectorAll('.tradebtn');
  if (this.elements && this.elements.length > 0) {
    this.elements.forEach((f) => {
      console.log(f)
      f.addEventListener('click', (event) => {
        console.log(event)
      });
    });
   }
}

我得到elements元素列表以添加事件监听器。点击事件监听器有时可以运行，但在大多数情况下不起作用。

我对这种行为感到困惑。我还尝试将代码setTimeout()括起来，但是没有运气。

Answer 1

您应该使用@HostListener处理事件。

添加条件event.target.matches('.tradebtn')来检查元素源。

@HostListener('document:click', ['$event'])
   onclick(event) {
   if(event.target.matches('.tradebtn')) {
        console.log(event)
   }
}

不一致的addEventListerner行为角度为7

1 个答案: