模板中一个字符串的超链接文本

Posted 2023-02-23

【中文标题】模板中一个字符串的超链接文本

【英文标题】：Hyperlink text of one string in angular in the template

【发布时间】：2020-10-17 20:29:09

【问题描述】：

我在角度组件中有这个字符串：

...
value="Click <a href='/something'>here</a>";
...

在 html 中我有：

...
<div>
  value
</div>
...

我希望在页面中看到一个单词链接，例如：单击此处。

而不是我看到 Click here as text.

我需要这个，因为我正在将警报对话框自定义为模态。

是否可以将值文本视为 html 链接？

【参考方案1】：

当您在模板中使用带有标签的值时，Angular 会将其识别为不安全的，因此会直接清理该值。您需要将您的值绑定到您的 div 的 innerHTML 属性。 Angular doc

所以在你的情况下这样做

...
<div [innerHTML]="value">
</div>
...