Display text in html using Angular

Question

I am trying to make text as html using ng-bind as shown

<div ng-bind-html="text"></div>

The problem is that Angular removes the style attribute and does this:

"<mark style='background-color:#FF9DFF;'>APPLE</mark>."

:

<mark>APPLE</mark>

How to render as html and save styles? I am using Angular version 1.2.6

Answer 1

You can try this function when you execute ng-bind-htmlin your controller

$sce.trustAsHtml('myHTML'); //$sce would be the parameter with $scope in module

Hope it works

$ NgSanitizeDocs

Answer 2

First of all, enable angular -sanitize.js

<div ng-bind-html="deliberatelyTrustDangerousSnippet()"></div>

Then in the controller add this method

pk.controller("createBlog", function($scope, $sce){
   //ace needs to be injected in the controller.
   $scope.deliberatelyTrustDangerousSnippet = function() {
       return $sce.trustAsHtml($scope.htmlcontent); //html content is th binded content.
   };
})