Angularjs：ng-bind-html & ng-repeat答案

【问题标题】：Angularjs: ng-bind-html & ng-repeatAngularjs：ng-bind-html & ng-repeat
【发布时间】：2014-03-17 01:00:54
【问题描述】：

我有一个视图，在我从数据库中为此模板检索它们后，我正在更新它们：

<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)

我正在尝试使用我存储的降价文本更新 {{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 有关吗？

【问题讨论】：

标签： angularjs angularjs-scope angularjs-ng-repeat

【解决方案1】：

您尝试在 TrustDangerousSnippet 函数中解析 input_data.post，但这并不存在。

相反，将对象传递给这样的方法：

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

将方法改为：

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

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

编辑：另外，您不需要在 html 中添加 {{post.post}}。

【讨论】：