Angular变量生成HTML

Question

我将尝试使用AngularJS制作博客页面，并在消息部分添加了一个类似于以下内容的

标签。

<div class="post-content">
    {{jsonPost.message}}
</div>

在变量jsonPost.message中，我得到了一个类似于这样的字符串

<p>paragraph 1</p>
<p>paragraph 2</p>

我看到屏幕上显示的并不是两个html段落，而是像文本一样的<p>文本。有没有办法将它们变成html代码？然后通过CSS进行定位。

谢谢，丹尼尔！

- Pacuraru Daniel

---

你尝试过使用ngBindHtmlUnsafe吗？看一下这个链接，我还没有使用过，所以不会将其发布为答案。http://docs-angularjs-org-dev.appspot.com/api/ng.directive:ngBindHtmlUnsafe - Naveed

Answer 1

由于您正在使用v1.2版本，您需要使用ng-bind-html。要绕过净化，请使用$sce服务：

$scope.jsonPost.message = $sce.trustAsHtml("<p>paragraph 1</p>");

HTML:

<!-- bypasses sanitizaton -->
<div data-ng-bind-html="jsonPost.message"></div>

- AlwaysALearner

Answer 2

您可以使用ng-bind-html-unsafe：

<div class="post-content" ng-bind-html-unsafe="jsonPost.message"></div>

- zs2020

---

注意：这在Angular 1.2+中不起作用。它已被Strict Contextual Escaping所取代。请参阅http://docs.angularjs.org/api/ng.$sce。 - TheSharpieOne