dynamic HTML rendering in Angular

Question

I have a model in angular view. I am passing String to the model from the controller as

<b>myName</b>

hoping it to be displayed in bold, but I am not getting the desired result. Instead its getting displayed as a string as it is. Why is it so,and what is the fix? I thought angular directive compile would help, but no help.

Make sure you are using [ngSanitize](https://docs.angularjs.org/api/ngSanitize) — Matthew Green, Feb 17 '15 at 14:52
possible duplicate of [Insert HTML into view using AngularJS](http://stackoverflow.com/questions/9381926/insert-html-into-view-using-angularjs) — Robert Moskal, Feb 17 '15 at 14:56

Rebornix · Accepted Answer · 2015-02-17T15:12:47.297

0

Instead of passing string to models in scope directly, you should use sce.trustAsHtml

$scope.bindHTML = $sce.trustAsHtml("<b>myName</b>");

Then in your view template, use ng-bind-html to handle html binding.

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

edited Feb 17 '15 at 15:12

answered Feb 17 '15 at 14:55

Rebornix

5,272
1
23
26

score 0 · Answer 2 · answered Feb 17 '15 at 15:00

0

Not being able to see your code it's hard to say exactly what's going on but my guess is you probably need to the model using ngBindHtml. If your model has an html string in it then that's usually the way to go.

answered Feb 17 '15 at 15:00

ragamufin

4,113
30
32

dynamic HTML rendering in Angular

2 Answers2