CODEWITHSUNDEEP
jqueryangularjsangularjs-ng-repeatappend
Torben G
Torben G

Reputation: 800

Can i append a div which includes ng-repeat

i am trying to append a div to another div. But this div which i will append has a ng-repeat (AngularJS).

my html code looks like this:

<div id="content"></div>

and this is my jquery/angularjs function:

$('#content').append('<div ng-repeat="article in articles"><p>{{article.title}}</p></div>);

is it possible to run the ng-repeat after I append it?

Thank you guys :)

Upvotes: 2

Views: 1731

Answers (2)

Anil Panwar
Anil Panwar

Reputation: 2622

You have to re-compile the DOM after appending new elements in the div

Your HTML

<div id="content"></div>

Step 1: Create HTML to be appended

 var articleHTML= angular.element('<div ng-repeat="article in articles"><p>{{article.title}}</p></div>');

Step 2: compile the template

var compileAppendedArticleHTML= $compile(articleHTML);

Step 3: link the compiled template with the scope.

var element = compileAppendedArticleHTML($scope);

Step 4: Append to DOM 

$("#content").append(element);

Upvotes: 7

Indresh Tayal
Indresh Tayal

Reputation: 306

This link may be helpful for you

http://blog.sodhanalibrary.com/2014/08/append-or-prepend-html-to-div-using.html#.WJMS_qLhXIU

Upvotes: 0

Related Questions