Angular Material Mat-Card 插值添加 html 格式字符串错误

Question

我有一个 Angular Material Mat-Card，我需要添加插值以将内容字符串添加到 mat-card-content。

以下作品无需插值

 <mat-card-content>
            <p>Guidelines.</p>
            <p>Click on the folliwng link for additional information</p>
            <a href="http://mySite/documents/guidances.docx">http://mySite/documents/guidances.docx</a>
        </mat-card-content>

带有工作链接的渲染页面

我的内容将来自网络服务，不再是静态页面。现在我插入内容如下

<mat-card>
                        **<mat-card-content>{{message.content}}</mat-card-content>**
                    </mat-card>

当 hmtl 页面呈现时，它不会对字符串进行任何 html 格式化。

看起来像这样

<p>Guidelines.</p><p>UClick on the folliwng link for additional information</p><a href="http://mySite/documents/guidances.docx">http://mySite/documents/guidances.docx</a>

它只是将 html 代码粘贴到 amt-card 中。

任何帮助表示赞赏。谢谢

Answer 1

你可以使用innerHtml：

<mat-card-content>
 <div [innerHTML]="message.content"></div>
</mat-card-content>