Angular 4：[innerHTML]

Question

经过大量搜索后，我试图找到一种简单的方法，在单击动态创建的HTML中保存在数据库中的链接时执行方法。我正在向用户创建有关在消息正文中嵌入了各种链接的事务的消息。我需要将消息保存在数据库中，并且在检索和查看时，用户应该能够单击链接以调用将其路由到正确页面的方法。

HTML看起来像这样：

"string myHTML='<div><a (click)=method1(tranID)>Execute Method 1></a><div>
<br><br>
<div><a (click)=method2(tranID)>Execute Method 2></a><div>'

在我的HTML文件中，我有：

 <div [innerHTML]="myHtml"></div

我知道这是Angular的设计，但必须有一个相当直接的方法来做到这一点。我不是Angular专家，需要一些帮助！感谢

Answer 1

假设您的html包含<a href="/home">home</a>之类的链接，您可以绑定容器上的（click）事件，并从内部动态添加的elemens中捕获任何冒泡点击：

<div (click)="click($event)" [innerHTML]="html"></div>

click(evt) {
   const href = evt.target.getAttribute('href');
   if (href) {
      evt.preventDefault();
      this.router.navigate(href);
   }
}