在离子3/4/5中渲染HTML含量

Question

view.html

<div>{{text}}</div>

问题是"文本"具有我希望显示的HTML，但仅显示HTML标签和文本。

我该怎么做才能渲染此类内容？

我已经尝试了早期版本(Ionic 1/2(解决方案，似乎没有任何作用于Ionic V3。

Answer 1

您应该使用innerHTML属性绑定：

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

请查看Angular Docs以获取更多信息。

Answer 2

如果您想在段落中写下它，可以通过

来做到这一点

<p><span [innerHTML]="htmlObject"></span></p>
<p><span>"{{title}}" is the <i>interpolated</i> title.</span></p>
<p>"<span [innerHTML]="title"></span>" is the <i>property bound</i> title.</p>
<p><img src="{{heroImageUrl}}"> is the <i>interpolated</i> image.</p>
<p><img [src]="heroImageUrl"> is the <i>property bound</i> image.</p>

Answer 3

＆lt;div [innerhtml] =＆quort;

此解决方案有效，但有些CSS在HTML中不起作用。就像我们从后端获得了适当的数据，但不适用于Innerhtml。