ng-bind-html - with angular-sanitize - throws error in console

Question

I am trying to add html to a div as follows:

$scope.thehtml = $sce.trustAsHtml("<b>hello</b>")

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

I see following error in console:

TypeError: undefined is not a function
    at htmlParser (js/angular/angular-sanitize.js:205:17)
    at $sanitize (js/angular/angular-sanitize.js:119:5)
    at Object.ngBindHtmlWatchAction [as fn] (js/angular/angular-sanitize.js:420:15)
    at h.$get.h.$digest (js/angular/angular.min-125.js:98:396)

The angular-sanitize.js:205:17 is this:

if ( html.indexOf("<!--") === 0 ) {
index = html.indexOf("-->");

Apparently html is not being treated as a String, therfore the error on indexOf ?

I have included the angular-sanitize.js, and added module 'ngSanitize' to the app.

Answer 1

Please see this plunk. From what I can see your implementation looks fine! My plunk is working and I am not getting an exception with the same code. I have not had to add ngSanitize as a dependancy of the module, I have just injected $sce into my controller.

The versions of the libraries I have used are as follows:

https://code.angularjs.org/1.2.28/angular.js
https://code.angularjs.org/1.2.0-rc.3/angular-sanitize.js

Please try replacing your script references with these versions to see if it the libs that are at fault.

Let me know how you get on! Good luck :)