在ng-repeat中解析来自JSON的HTML

Question

我今天开始学习AngularJS,到目前为止我做得很好.但我遇到了一个问题,我似乎无法找到答案.我要做的是打印<p>Text</p>格式化的html字符串Text.到目前为止,Angular将它打印成平原<p>Text</p>.

我的代码如下:

JS

var blogApp = angular.module('blogApp', []);

blogApp.controller('blogPostsCtrl', function($scope, $http) {
    $http.get('wp-json/posts').success(function(data) {
        $scope.posts = data;
        $scope.postsLoaded = 'visible-lg';
    });
});

HTML

<article id="post-{{post.ID}}" <?php post_class(); ?> itemscope itemprop="blogPost" itemtype="http://schema.org/BlogPosting" ng-repeat="post in posts" ng-class="postsLoaded">

    <h2 class="entry-title" itemprop="headline"><a title="Link do {{post.title}}" rel="bookmark" href="{{post.link}}">{{post.title}}</a></h2>

    <div class="entry-content">
        <img ng-src="{{post.featured_image.source}}">
        {{post.content}}
    </div>
    <footer class="entry-footer">
        <ul class="categories"><li ng-repeat="category in post.terms.category"><a href="{{category.link}}">{{category.name}}</a></li></ul>
    </footer>
</article>

我的问题是{{post.content}}.我想试试ng-bind-unsafe,但它被删除了.我也尝试过ng-bind-html="post.content",但它没有用.

我正在使用Angular 1.4.

Answer 1

你在找ngBindHtml.例如,对于您的内容,您可以使用以下内容:

<div ng-bind-html="post.content"></div>

计算表达式并以安全的方式将生成的HTML插入元素中.默认情况下,生成的HTML内容将使用$ sanitize服务进行清理.要使用此功能,请确保$ sanitize可用,例如,在模块的依赖项中包含ngSanitize(不在核心Angular中).要在模块的依赖项中使用ngSanitize,您需要在应用程序中包含"angular-sanitize.js".