是否可以在JSON对象中读取HTML标记，并将其显示在网页上？

Question

我有一个JSON对象，如下所示：

id:
text: <h1>This is my text</h1> <p> I want to include HTML 
            and reflect those tags on the page. </p>

我正在使用Angular2的HTTP_PROVIDER来读取JSON中的数据。

在我的HTML模板中，我在网页上显示JSON.dataString。如何在网页上反映HTML标签，目前标签显示为纯文本。

<p>{{jsonObject.text}}</p>

有没有办法读入JSON对象中包含的HTML标记，并将它们反映在网页上？

Answer 1

您可以尝试这样做：

function textHtml(input) {
    var el = document.createElement("textarea");
    el.innerHTML = input;
    return el.value;
}

然后使用此函数获取带标签的文本

Answer 2

类似的东西：

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

应将文本对象显示为原始HTML。当你做这样的事情时要小心XSS注射。

this question更多细节。

Answer 3

我不会使用Angular但是会做类似的事情。

<p id="myId"></p>
<script>
document.getElementById("myId").appendChild(jsonObject.text);
</script>

我没有测试它。