Rendering HTML in a <div> - AngularJS

angularjs

Solution

Use `ng-bind-html`:

<div ng-repeat="statusUpdate in statusUpdates | orderBy:'-time'">
  <div class="actContent" ng-bind-html="statusUpdate.text"></div>
</div>

Don't forget to add `ngSanitize`, which is in a different js file (`angular-sanitize.js`):

app.module('app', ['ngSanitize']);

Problem

So I have the following div and what I'd like to do, is have the div render HTML if it exists inside `{{statusUpdate.text}}`. What I've done, is wrap the usernames in the span you see below - but I'd like it to be rendered as actualy HTML, today it's just the HTML in plain text. ``` <div ng-repeat="statusUpdate in statusUpdates | orderBy:'-time'"> <div class="actContent">{{statusUpdate.text}}</div> </div> ``` Currently I just get this as output - see below - and this is the output in the browser ``` <div class="actContent ng-binding">hello &lt;span class='mentionedUserTag'&gt;Aref Abedi&lt;/span&gt; how are you? </div> ``` Any ideas on how to solve this?

Original source