angularjs string variable to html element using sanitize

Question

AngularJS code:

$scope.checking="<div style="color:red;">check</div>";

HTML code:

<p ng-bind-html="checking"></p>

so i used $sanitize for this one and the ng-bind-html directive to get the job done.

So the result in html page is:

check

and the above should come in red color

i got the output but the string 'check' does not come in red! the style tag is ignored! how can i do it? do i use interpolate?

Any way to do it? hopefully its simple... AngularJS experts please help!

Pankaj Parkar · Answer 1 · 2016-04-24 18:49:21Z

up vote 2 down vote

$sanitize Sanitizes an html string by stripping all potentially dangerous tokens.

So do use $sce service method to make it trusted html using trustAsHtml method.

$scope.checking= $sce.trustAsHtml("<div style="color:red;">check</div>");

answered Apr 24 at 18:42

Pankaj Parkar

69.7k955112

docs.angularjs.org/api/ng/service/$sce – sniels Apr 24 at 18:46

add a comment |

1 Answer 1