Angularjs: ng-bind-html &ng-重复 [英] Angularjs: ng-bind-html & ng-repeat

问题描述

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

<div class="col-lg-9 col-lg-offset-2"><!-- 博客条目--><br ng-hide="$last"><h1><a href="{{'#/post/' + post.title}}">{{post.title}} </a></h1><p><span class="glyphicon glyphicon-time"></span>发表于 {{ post.time_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">
<br><br><div ng-bind-html="TrustDangerousSnippet()"><p>{{post.post}}</p>

…………没有正确关闭(巨大的模板)

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

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

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

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

这与没有以正确的方式使用 ng-repeat 有关系吗?

解决方案

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

相反，像这样将对象传递给方法:

将方法改为:

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

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

此外，您不需要在 html 中添加 {{post.post}}.

I have a views that i am updating after I retrieve them from the database for this template:

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

I am trying to update {{post.post}} with markdown text that I store and have it display properly using my controller. The code is as follows:

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

input_data is the collection of JSON objects(blog posts) from my server. The problem is that this entire object is not displayed, but if were to display one of the objects, it renders to the page. What could be the problem?

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

Does this have something to do with not using ng-repeat in a proper way?

解决方案

Your trying to parse input_data.post in the TrustDangerousSnippet function, but that doesnt exist.

Instead, pass the object into the method like this:

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

Change the method to:

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

fiddle example: http://jsfiddle.net/ZxPHW/

Edit: in addition, you don't need to add {{post.post}} to the html.

这篇关于Angularjs: ng-bind-html &ng-重复的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！