web-dev-qa-db-ja.com

ng-repeatで$ sce.trustAsHtmlを使用するAngularJS

Ng-repeatのオブジェクトのプロパティで$ sce.trustAsHtml（）を使用しようとしています。その結果、HTMLは完全に空白になります。ただし、HTMLはngSanitizeを使用して正しく出力します。

<div ng-repeat="question in questions">
    <p ng-bind-html="$sce.trustAsHtml(question.body)">
    </p>
</div>

ちなみに私はAngularJSv1.3.0-beta.3を使用しています。バグがあるのか​​、何か間違っているのかわからない。

javascriptangularjsangularjs-ng-repeatng-bind-htmlngsanitize
14
ZoM

式は$sce.trustAsHtmlのコンテキストで評価されるため、式で$sceを使用することはできません（$scopeが$scopeのプロパティでない限り）。

最もクリーンなアプローチは、ngSanitizeを使用することです。
2番目にクリーンな方法は、$sce.trustAsHtmlを$scopeの関数として公開することです。

<div ng-repeat="...">
    <p ng-bind-html="trustAsHtml(question.body)"></p>
</div>

$scope.trustAsHtml = $sce.trustAsHtml;
29
gkalpak

またはフィルターを持っている：

angular.module('myApp')
    .filter("sanitize", ['$sce', function($sce) {
        return function(htmlCode){
            return $sce.trustAsHtml(htmlCode);
        }
}]);

hTMLで：

<div ng-bind-html="question.body | sanitize"></div>
14
Moin Haidar