CODEWITHSUNDEEP
htmlangularjs
mattwallace
mattwallace

Reputation: 4222

How do I load HTML from a string and have AngularJS bindings work

I have an angular project that will be loading external HTML from a string variable into a div that currently has a controller scoped to it.

The HTML that I will be loading from the var will have angular bindings in the html. Once loaded the bindings don't seem to work. I'm wondering how I get angular to recognize the new HTML and parse the bindings so that content renders properly.

Right now the HTML loads but I end up seeing things like {{myvar}} render as text and not render the scoped variables.

Upvotes: 0

Views: 257

Answers (2)

ritchielee
ritchielee

Reputation: 268

Output to your element like this:

<p ng-bind-html="myvar.name"></p>

Upvotes: 0

T W
T W

Reputation: 6317

You need to do manually what angular does automatically inside ng-view directive. Something like along those lines should do the trick:

var html = '...';
var linker = $compile(html); // compile html
var element = linker($scope, function () { // remember to pass correct scope here
}); // link compiled html with scope
$('.target-div').append(element);

Upvotes: 1

Related Questions