2016-04-18 12 views
1

スタックオーバーフローですべてのソリューションを試しましたが、回答が見つかりませんでした。角型ディレクティブng-bind-htmlが動作しない場合があります

私はangle 1.4.4とng-repeatディレクティブを使用しています。テーブル行内にHTMLコメントを表示したいとします。私は

のようなものを書くとき、それが働いている、また、

// html filter (render text as html) 
angular.module('app').filter('html', ['$sce', function ($sce) { 
    return function (text) { 
     return $sce.trustAsHtml(text); 
}; 

:サンプルコメントは「テストコメント

その後
<tbody ng-show="dataLoaded"> 
    <tr ng-repeat="comment in comments | filter: commentFilter | commentFilter: customCommentFilter | limitTo: 10 : (currentPage*10-10)"> 
     <td ng-bind-html="comment.Comment | html"> 
     </td> 
    </tr> 
</tbody> 

、私のフィルターファイル内に、私は次のフィルタを使用していますです

<td ng-bind-html="'<b>abc</b>' | html"> 

最後に、私が何かを書くとき

<td> 
    {{comment.Comment}} 
</td> 

コメントは<B>テストコメント<また、私が追加した/ B >

ngSanitizeとして表示されます。私はNG-バインドhtmlの仕事を作ることができるか、

(function() { 
    'use strict'; 

    var app = angular.module('app', [ 
     // Angular modules 
     'ngCookies', 
     'ngRoute', 
     'ngAnimate',      
     'ngSanitize',      
    ]); 
    ... 
    ... 
})(); 

私の質問があります私の例では?

+1

私はテーブルでJSFiddleを構築しましたが、カスタムフィルタなしで正常に動作します。アプリモジュールにngSanitizeを追加してもよろしいですか? https://jsfiddle.net/3t4yyh7p/25/ –

+0

はい。 NgSanitizeが追加されました。私は自分の質問を編集した – Marek

答えて

-1
<tbody ng-show="dataLoaded"> 
    <tr ng-repeat="comment in comments | filter: commentFilter | commentFilter: customCommentFilter | limitTo: 10 : (currentPage*10-10)"> 
     <td ng-bind="comment.Comment"> 
     </td> 
    </tr> 
</tbody> 
関連する問題