Reputation: 8096
I've got a comments section on my site where I save htmlencoded comments in my database. So I added this comment-
"testing" `quotes` \and backslashes\ <b>and html</b>
and it saved in the database as-
"testing" 'quotes' \and backslashes\ <b>and html</b>
All good but when I print it to my page
<li class="media" ng-repeat="comment in comments">
<a class="pull-left" href="#">
<img class="media-object" src="/{{comment.thumb}}" width="24" alt="{{comment.username}}">
</a>
<div class="media-body">
<h5 style='margin: 0px;'><a href="/profile/{{comment.username}}">{{comment.username}}</a></h5>
<p>{{comment.message}}</p>
</div>
</li>
The ampersands are automatically changed to
&
So the resulting string on the page will be-
&quot;testing&quot; &#039;quotes&#039; \and backslashes\ &lt;b&gt;and html&lt;/b&gt;
Of course this won't show properly. I tried passing the commented to a parseAmper filter that replaces all encoded ampersands with & but it doesn't stick. How can I print ampersands properly?
Upvotes: 3
Views: 12523
Reputation: 25682
You can use:
<body ng-app="demo" ng-controller="MainCtrl">
<span ng-bind-html="foo"></span>
</body>
angular.module('demo', []);
var demo = angular.module('demo').controller('MainCtrl', function ($scope, $sce) {
$scope.foo = $sce.trustAsHtml('"testing" 'quotes' \and backslashes\ <b>and html</b>');
});
And here is a demo.
Upvotes: 3