How to bind HTML to an Element - AngularJS

Question

I am trying to bind html to my div element, but dont really know how to do it. I am not great with angularjs, but should ng-bind-html do the trick?

This is how I tried to do it,

<div ng-bind-html="{{tile.Info.Title}}"></div>
<div ng-bind-html="{{tile.Info.Content}}"></div>

In angular 2 its just [innerHTML], cant get it to work here, any suggestion?

general rule: if it has `ng-`, then you don't need curly brackets `{{ ... }}` — Aleksey Solovey, Dec 19 '17 at 09:54
Possible duplicate of [AngularJS data bind in ng-bind-html?](https://stackoverflow.com/questions/20796102/angularjs-data-bind-in-ng-bind-html) — the_mishra, Dec 19 '17 at 10:04

score 2 · Answer 1 · answered Dec 19 '17 at 09:58

2

You can get an example here.

<div ng-controller="ExampleController">
 <p ng-bind-html="myHTML"></p>
</div>

answered Dec 19 '17 at 09:58

Quan VO

score 1 · Accepted Answer · edited Dec 19 '17 at 10:15

1

As also suggested in comments by @Aleksey when you are using ng- there is no need to use curly brackets {}. So your code should be like:

<div ng-bind-html="tile.Info.Title"></div>
<div ng-bind-html="tile.Info.Content"></div>

edited Dec 19 '17 at 10:15

a1626

answered Dec 19 '17 at 09:53

2 Answers2