Question

我在使用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，但它显示所有字符串内联。

感谢。

Answer 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中，它将省略欢迎之前的额外空格，并且只留下一个空格。

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

<pre>{{a}}<pre>

Answer 2

您可以使用instanceof

告诉浏览器保留空白区域

如果您仍需要自动换行，可以使用style="white-space: pre"