从数据库导入部分 HTML 时，Angular [routerLink] 不起作用答案

【问题标题】：Angular [routerLink] does not work when part of HTML imported from database从数据库导入部分 HTML 时，Angular [routerLink] 不起作用
【发布时间】：2020-09-09 11:33:23
【问题描述】：

我有点理解为什么以下方法不起作用，但也许我可以得到一些指导或解决方法？

所以我正在使用一个模块，该模块从我从 webApi 导入的数组中构建树结构。我无法通过 Angular 对节点名称（即在树的每一层上显示的内容）进行太多控制，但我可以使用 [innerHTML]="node.data.name | safeHtml" All 控制节点名称的 HTML很好，如果我点击节点的检查元素，我会看到以下内容

&lt;a [routerlink]="/account-detail/a7e9f9ba-e202-4122-8275-4010b47ffc55"&gt;Account 1&lt;/a&gt;

问题是点击链接不起作用。我确实通过将它直接粘贴到 Angular HTML 模板中的树视图上方来测试这个完全相同的 HTML，然后它就可以正常工作了。我的猜测是，因为我导入了这个 HTML，所以 dom 和 Angular 脚本之间没有绑定。不幸的是，我不确定，也不知道在 Google 上搜索什么。我也尝试过（单击）命令，但问题完全相同。控制台中也没有错误。

我们将不胜感激任何建议。我还必须补充一点，如果我使用普通的 href 方法，它可以工作，但当然这是一个完整的页面刷新。

【问题讨论】：

你可以试试 [routerLink]="['yourLink']"
你为什么不使用(click)事件？喜欢<a (click)="coolfunction()"></a>
嗨，尽管我希望这仍然可以进行完全相同的交互。基本上没有错误，但没有任何反应。还是谢谢
我以 [routerLink] 为例。也试过（点击）但完全相同的问题。即使 HTML 看起来 100% 正确，如果您使用元素检查器单击查看它，它也不会执行任何操作。控制台中什么都没有。朱奈德·马利克似乎找到了一种方法来做到这一点。我接下来要试试。在实施之前仍然试图理解为什么会这样。

标签： angular

【解决方案1】：

在 angularjs 中，它可以使用 $compile 指令来实现，但是这个 $compile 指令已在较新的版本中被删除。几天前我遇到了这个问题。有一个 npm 模块可以用来实现这一点。 here是我的问题的链接，您可以在答案中找到解决方案。

【讨论】：

谢谢，如果可行，我会回复，今晚会尝试实施，但我同意这是完全相同的问题
当然，如果您需要任何帮助，请告诉我