2016-08-12 40 views
0

我有一個數組從數據庫加載的JSON對象。每個對象中都有一個關鍵字html內容打印從角度js數據庫加載的html數據

我想在我的視圖中顯示這些內容以及其他所有內容。我使用ng-html-bind,因爲我在我的控制器中有$sce依賴項。如果我把一個字符串像<h1>Trusted html</h1>那樣工作。但不適合我的內容。

我真正想要的是如果我把這些內容像$scope.htmlContent = $sce.trustAsHtml(data.content);它應該工作和循環所有這些在我看來他們屬於。但它不工作。

我也製作了另一個數組,單獨推送了所有這些內容材料,但當我通過它們時$sce.trustAsHtml(trustMe);出現問題。

-----------------------------------編輯---------- -------------------------------

這是我的對象:

[Object, Object, Object, Object, Object, Object, Object, Object, Object] 

: 
Object 
8 
: 
Object 
$$hashKey 
: 
"object:22" 
content 
: 
"<h2>Test data.</h2> 
↵" 
created_at 
: 
"2016-08-12 14:12:35" 
id 
: 
9 
name 
: 
"Test" 
points 
: 
4 
semester 
: 
"Eagle Nest" 
semester_id 
: 
6 
status 
: 
0 
subject 
: 
"Android" 
subject_id 
: 
6 
updated_at 
: 
"2016-08-12 14:12:35" 
user_id 
: 
1 
__proto__ 
: 

我查看

<div class="panel panel-default" ng-repeat="quiz in quizzes"> 
       <div class="panel-body"> 
       @ quiz.semester @ <span class="pull-right">Subject: @ quiz.subject @ </span> 
       <hr class="blur-line"> 
       <p class="list-group-item-text list-item"> 
       <i class="fa fa-long-arrow-right"></i> @ quiz.name @ 
       </p> 
       <p class="details" ng-bind-html="MytrustedHtml"></p> 

       </div> 
      </div> 

控制器

$scope.MytrustedHtml = $sce.trustAsHtml(data.content); 
+2

任何理由,你不使用你的項目'NG-repeat'?這裏是我通常如何做的一個例子:https://jsfiddle.net/ahmadabdul3/hp8sbzwf/25/ –

+0

你可能會分享代碼嗎? Jsfiddle會很棒 –

+0

這是一個JSON對象數組還是一個對象數組?另外,ng-html-bind不存在,ng-bind-html會。 – mguimard

回答

0

過濾器可能是更好的管理方法。

.filter('rawHtml', ["$sce", function($sce) { 
    return function(input) { 
     return $sce.trustAsHtml(input); 
    }; 
}]); 

而在標記

<p ng-bind-html="MytrustedHtml | rawHtml"></p> 
+0

謝謝。有效。 –