Search code examples
angularjsplaintextng-bind-html

$sce.trustAsHtml not working


I'm getting post content from my REST api. The content I'm getting: "<p>test post body</p>"

first, I'm parsing plain text

data[i].postBody = $sce.trustAsHtml(data[i].postBody);

after I'm doing this and trying to display with ng-bind-html

<span ng-bind-html="value.postBody"></span>

and continues displaying as html.

output:

<p>test post body</p>

I'm not able to show the text without html tags

Please, help me!


Solution

  • Have used htmlDecode function to escape HTML entities first

    HTML :

    <div ng-bind-html="value.postBody"></div>
    

    JS :

    angular.module('ngApp', ['ngSanitize'])
    .controller('controller1', ['$scope','$sce', function($scope, $sce) {
        // Some Code ...
        ...
        ...
        function htmlDecode(input) {
            var e = document.createElement('div');
            e.innerHTML = input;
            return e.childNodes.length === 0 ? "" : e.childNodes[0].nodeValue;
        }
        data[i].postBody = $sce.trustAsHtml(htmlDecode(data[i].postBody));
        ...
        ...
        // Some Code ...
    }]);
    

    Fiddle Link : http://jsfiddle.net/3J25M/771/