How to have AngularJS output escaped HTML
angularjs, html-escape-characters, javascript, json
Solution
At the same time `$sce` service was introduced (angular 1.2), support for `ng-bind-html-unsafe` directive was dropped. The new directive is `ng-bind-html`. If you use this, the code should work as documented:
<div ng-bind-html="mail.htmlbody"></div>
Problem
I am getting JSON data from the server, one of the field contains escaped html (an email body actually): `<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` (more...) I am getting crazy at trying to render it with AngularJs. The following is not working: ``` <div ng-bind-html-unsafe="mail.htmlbody"></div> ``` Which I believe is normal because the html is in fact escaped. Should I unescape it first? Is Angular capable of unescaping html with some available service? If I use $sce like this: ``` scope.mail.htmlbody = $sce.trustAsHtml(scope.mail.htmlbody); ``` The source html is displayed, inspecting the element I can see the content is quoted. In other words in the page the source html is displayed instead of the html being rendered. Maybe I am missing something?