在文本框中显示HTML代码

Question

我有一个文本框，我从Json响应中填充如下

 <div class="gadget-body" style="height:100px">
    <label>{{ textData}}</label>
  </div>

但是现在我的Json正在返回带有<p>和<h1>标记的html代码。 我正在绑定响应，但显示时使用<p>和<h1>标记而不是应用它。

Answer 1

最简单的方法是使用innerhtml标记

<div class="gadget-body" >
   <div [innerHTML]="textData">
</div>
  </div>

Answer 2

也许有这样的功能：

function htmlToPlaintext(text) {
  return text ? String(text).replace(/<[^>]+>/gm, '') : '';
}

然后您将使用：

<div class="gadget-body" style="height:100px">
    <label>{{ htmlToPlaintext(textData) }}</label>
</div>