Angular 4+ : 是否可以将输入到模板的字符串评估为 HTML？

Question

有没有办法评估传递到组件模板中的字符串作为 HTML？

我正在传递这个：

export const BARS: Blurb = {
  title: "Bars",
  description: "blah blah blah. <a routerLink='/barcades'>Barcades</a>"
}

进入这个：

<h3>{{blurb.title}}</h3>
<p>{{blurb.description}}</p>

它目前正在按字面打印 <a routerLink='/barcades'>Barcades</a>，而不对其进行评估。

作为背景，我正在制作一个旅游博客。我所有的页面都具有相同的结构：一堆带有标题的文本部分。为了避免代码重复，我创建了数据 classes 基于模型 class 如 these。

基本上，我为我的网站创建了所有文学内容的 JSON，然后将它们传递到一个公共组件的多个实例中。这在当时似乎是个好主意，但现在我想添加链接（最好是 routerLinks）。这可能吗？也许使用管道？这甚至是一个可以接受的策略吗？我很想知道 Angular.

中是否有标准方法

Answer 1

您要查找的是 innerHTML 属性。像这样：<div [innerHTML]="yourStringObject"> ....

您可能还需要先对其进行清理，查看线程 here。