web-dev-qa-db-ja.com

AngularJS出力でHTMLをエスケープする方法

サーバーからJSONデータを取得しています。フィールドの1つにはエスケープされたhtml(実際にはメール本文)が含まれています。

<html>\r\n<head>\r\n<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">\r\n</head>\r\n<body dir="auto">\r\n<div>Buonasera, ho verificato i dati sul mio account ed il numero di cell che vi ho fornito</div>\r\n<div><br>\r\n<a (もっと...)

私はAngularJsでレンダリングしようと夢中になっています。

以下は機能していません。

<div ng-bind-html-unsafe="mail.htmlbody"></div>

Htmlは実際にはエスケープされているため、これは正常だと思います。最初にエスケープを解除する必要がありますか? Angularは利用可能なサービスでhtmlをアンエスケープできますか?

このように$ sceを使用する場合:

scope.mail.htmlbody = $sce.trustAsHtml(scope.mail.htmlbody);

ソースHTMLが表示され、コンテンツが引用されていることを確認できる要素を調べます。つまり、ページには、レンダリングされるhtmlの代わりにソースhtmlが表示されます。たぶん私は何かが欠けていますか?

38
Max Favilli

$sceサービスが導入された(角度1.2)と同時に、ng-bind-html-unsafeディレクティブのサポートが削除されました。新しいディレクティブはng-bind-htmlです。これを使用する場合、コードは動作するはずです 文書化されているように

 <div ng-bind-html="mail.htmlbody"></div>
46
Davin Tryon

次のディレクティブを使用します。

<div ng-bind-html="mail.htmlbody"></div>

アプリモジュールでangular sanitizeを使用することを忘れないでください。

ここで確認してください: http://docs.angularjs.org/api/ngSanitize

16
Md. Al-Amin