今日、私はRailsをバックエンドとして使用してJSON形式のデータを提供しようとしました。 AngularJSは、フロントエンドでJSONデータを処理するために使用されます。 AngularJSがHTMLテキストの一部を取得したとき。 Data-ng-bindを直接使用すると、逃げられます。 data-ng-bind-htmlを使用すると、エスケープをキャンセルできます。
ただし、data-ng-bind-htmlを直接使用すると、エラーが発生します。
コードコピーは次のとおりです。
エラー：[$ SCE：Unsafe]安全なコンテキストで安全でない値を使用しようとしています。
htmlフラグメントは、data-ng-bind-html = "html_in_string"を使用して除外する前に、$ sce.trustashtml（html_in_string）を使用して信頼としてマークする必要があります。
APIまたはAngularを介して取得したすべての記事の中で、各記事には、MarkdownまたはOrgによってレンダリングされたHTMLフラグメントであるHTML_Body属性があります。
APIを介してJSONデータを取得した後、AngularJSが提供するAngular.Foreachメソッドを使用して、各投稿のHTML_BODYをマークし、結果を信頼できるボディとして保存し、HTMLでdata-ng-bind-html = "post.trustedbody"を使用してエスケープをキャンセルします。
Angularjsパーツ
コードコピーは次のとおりです。
blog.controller（ 'postscontroller'、function（$ scope、$ http、$ sce）{
$ scope.posts = [];
$ scope.syncposts = function（）{
var request = $ http.get（ 'http：/localhost：3000/posts.json'）;
request.success（function（response）{
$ scope.posts = angular.foreach（angular.fromjson（response）、function（post）{
post.trustedbody = $ sce.trustashtml（post.html_body）;
}）;
}）;
};
$ scope.syncposts（）;
}）;
HTMLパーツ
コードコピーは次のとおりです。
<div data-ng-bind-html = "post.trustedbody"> </div>