AngularJS – Render HTML in template

If you have a $scope variable containing a HTML string, the following example would escape the HTML and print it strictly to the screen.


$scope.htmlString = "<h2>Hello World</h2>";


<div>{{ htmlString }}</div>


If you want to render HTML, add a filter.

app.filter('unsafe', function($sce) { return $sce.trustAsHtml; });


Then in the template

<div ng-bind-html="htmlString | unsafe"></div>


Done =)

Reference: StackOverflow – How do you use $sce.trustAsHtml(string) to replicate ng-bind-html-unsafe in Angular 1.2+


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.