ng-bind-html does not work

Question

please look at this fiddle

please type 4 in the text area, it should write an error message, that is in this line:

   $names.push('<div ng-bind-html-unsafe="snippet"></div>');

actually it does not. It prints the html code itself without handling,

and the underlying html is:

<li ng-repeat="user in list|splitList:appUsers" class="ng-scope ng-binding">
        &lt;div ng-bind-html="snippet"&gt;&lt;/div&gt;
    </li>

I tried to follow solutions from this topic

but nothing seem to help,

any help in fixing it will be regarded,

Answer 1

I got help from the chat room of angularjs,

the thing is that I should use:

<div ng-bind-html-unsafe="user">...</div>

instead of {{user}}

Answer 2

To get it to work you will need the following:

Declare it in html

div ng-bind-html="{expression}"></div> Or div class="ng-bind-html: {expression};"></div>

AND

reference angular-sanitize.min.js and then add

angular.module('YOUR_APP_NAME', ['ngSanitize']);

The last two are in the angularjs documentation for some reason...