从 JSON 中打印出与 HTML 中的转义字符相同的格式？答案

【问题标题】：Print out same format with escape characters in HTML from JSON?从 JSON 中打印出与 HTML 中的转义字符相同的格式？
【发布时间】：2017-11-06 22:23:28
【问题描述】：

我在以 HTML 格式打印 JSON 数据时遇到问题

var a = "We are the world.\n \tWelcome to our place.";

假设我有来自后端的这个 json 数据，我想打印出这样的东西。

<div>
We are the world.
  Welcome to our place.
</div>

我尝试过使用 ng-bind-html，但它显示所有字符串内联。

谢谢。

【问题讨论】：

【解决方案1】：

你不能简单地做到这一点。因为 \n 和 \t 不是 Html 的识别编码。您必须先将其替换为可识别的 Html 编码。您可以通过以下方式做到这一点：

$scope.a = "We are the world.\n \tWelcome to our place."
$scope.a.replace(/(?:\r\n|\r|\n)/g, '<br />');

但是现在如果你将此文本绑定到 Html 中，它会省略 Welcome 之前的多余空格，只留下一个空格。

因此，要解决这个问题，您必须将此 Html 绑定到 pre 标记中。它将保留您的格式。

<pre>{{a}}<pre>

【讨论】：

【解决方案2】：

你可以通过style="white-space: pre"告诉浏览器保留你的空格

如果还需要自动换行，可以使用white-space: pre-wrap

【讨论】：