Before version 1.2 of Angular JS it was possible to use the following directive:
<p ng-bind-html-unsafe="chamado.descricao"></p>
However, this directive was removed in later versions for security reasons.
How to display a variable in HTML without escaping the tags ?
1 – In your Controller pass the $scope and $sce variables.
var MeuCtrl = function($scope, $sce) {
}
2 – We will create a function that will be used in the View to allow a String to be displayed in HTML:
var MeuCtrl = function($scope, $sce) {
$scope.chamados = [{id: "1", descricao:"<b>blog.masterdaweb.com</b>"}]
$scope.trustAsHtml = function(string) {
return $sce.trustAsHtml(string);
};
}
3 – Then the View looks like this:
<li ng-repeat="chamado in chamados">
<p data-ng-bind-html="trustAsHtml(chamado.descricao)"></p>
</li>
The “called.description” object containing the HTML is passed to the“$sce.trustAsHtml()” function, which allows HTML to be displayed in the View.
