单击事件在innerhtml字符串angular 6中不起作用

单击事件在innerHTML字符串中不起作用是因为innerHTML会将字符串中的HTML代码解析并插入到DOM中，但是事件处理程序不会被解析和执行。这是由于innerHTML只是简单地将字符串作为HTML插入到指定元素中，而不会重新编译和绑定事件。

解决这个问题的方法是使用事件委托或者手动绑定事件。事件委托是将事件绑定到父元素上，然后通过事件冒泡机制来触发子元素的事件处理程序。这样即使子元素是通过innerHTML插入的，事件仍然可以正常触发。

以下是一个示例代码：

// 使用事件委托
document.addEventListener('click', function(event) {
  if (event.target && event.target.matches('.clickable-element')) {
    // 处理点击事件的逻辑
  }
});

// 手动绑定事件
var element = document.createElement('div');
element.innerHTML = '<button class="clickable-element">Click me</button>';
document.body.appendChild(element);

var button = document.querySelector('.clickable-element');
button.addEventListener('click', function() {
  // 处理点击事件的逻辑
});

在上述示例中，我们通过事件委托将点击事件绑定到document上，并通过判断目标元素的类名来确定是否是需要处理的元素。另外一种方法是手动创建元素并绑定事件处理程序。

对于Angular 6中的情况，可以使用Angular的事件绑定语法来解决这个问题。在组件的模板中，可以使用(click)来绑定点击事件，而不是直接使用innerHTML插入HTML代码。

<div [innerHTML]="htmlString" (click)="handleClick()"></div>

在上述示例中，我们使用属性绑定将HTML字符串绑定到div元素的innerHTML属性上，并使用(click)来绑定点击事件。这样就可以确保点击事件可以正常触发。

总结起来，单击事件在innerHTML字符串中不起作用是因为innerHTML不会重新编译和绑定事件。解决这个问题的方法可以是使用事件委托、手动绑定事件或者使用Angular的事件绑定语法。