CODEWITHSUNDEEP
jqueryangularjsangular-uiangular-ui-bootstrap
Alex
Alex

Reputation: 479

How to append an element with angular-ui popover

I have a function that appends divs to each cell in a table. You can imagine it as a table with a div in each cell. I do this by means of:

angular.element(document.getElementById()).append("<div>a</div>")

This works absolutely fine. However, I need this appended div to have a popover on it. This doesn't work:

em.append("<div popover='text' popover-trigger='mouseenter'>a</div>")

It appears to me that the popover directive is only attached to items on page-render. Any new items added after are not being tracked by the directive. How to fix it?

PS: if I add the same div but directly in the html template the popover works like a charm.

Upvotes: 0

Views: 840

Answers (1)

Felix Engelmann
Felix Engelmann

Reputation: 437

You need to use the $compile service for this to work. If you do it like this, it should work:

em.append($compile("<div popover='text' popover-trigger='mouseenter'>a</div>")($scope));

Upvotes: 2

Related Questions