微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Angularjs:ng-bind-html&ng-repeat

我有一个视图,我从数据库中检索此模板后我正在更新:

<div class="row" ng-repeat="post in posts">
        <div class="col-lg-9 col-lg-offset-2">        
          <!-- blog entry -->
          <br ng-hide="$last">
          <h1><a href="{{'#/post/' + post.title}}">{{post.title}} </a></h1>
          <p><span class="glyphicon glyphicon-time"></span> Posted on {{ post.time_Date | date:'MM/dd/yyyy @ h:mma'}} </p>
          <div class="image_Center">
            <!-- <img ng-src="{{post.imageUrl}}" width="550" height="450"> -->
            <img ng-src="{{post.imageUrl}}" width="450" height="350">
          </div>
          <br>
          <br>
          <div ng-bind-html="TrustDangerousSnippet()">
            <p>{{post.post}}</p>
          </div>
............not properly closed(huge template)

我正在尝试使用我存储的markdown文本更新{{post.post}}并使用我的控制器正确显示它.代码如下:

$scope.posts = input_data;
$scope.TrustDangerousSnippet = function() {
  return $sce.trustAsHtml(input_data.post);
};

input_data是来自我的服务器的JSON对象(博客文章)的集合.问题是没有显示整个对象,但如果要显示其中一个对象,它将呈现给页面.可能是什么问题呢?

$scope.posts = input_data;
$scope.TrustDangerousSnippet = function() {
  return $sce.trustAsHtml(input_data[1].post);
};

这是否与正确使用ng-repeat有关?

解决方法

您试图在TrustDangerousSnippet函数中解析input_data.post,但这不存在.

相反,将对象传递给方法,如下所示:

<div ng-bind-html="TrustDangerousSnippet(post.post)">
</div>

方法更改为:

$scope.TrustDangerousSnippet = function(snippet) {
  return $sce.trustAsHtml(snippet);
};

小提琴示例:http://jsfiddle.net/ZxPHW/

编辑:此外,您不需要将{{post.post}}添加到html.

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐