Open a bootstrap modal with a directive in angular

问题:

I'm using angular-ui bootstrap to show modal windows. I'd like to turn this into a directive that would let me pull content from the server and display it in a modal or popover…

For example: <a a-infobox="modal" href="#/content/one">A link</a> should get the content from the href and pull it into a modal window.

I pulled together a plunkr: http://plnkr.co/edit/cwtTHjMsW0knlsq2NNtg?p=preview. The first link has the a-infobox attribute. When I click on it no dialog shows up. In the console you can see that it was called.

When I click on the second link which is called from a controller, it opens the second dialog. Then when I click the button on that modal, it disappears and the dialog from the first click is right behind it.

I'm just starting to dig into directives and am sure I'm missing something fundamental. Thanks in advance.

回答1:

I found a solution...it appears that the modal needs to be applied so angular will process it on the next digest.

A simple line: scope.$apply($rootScope.dlg); is all it took.

The plunker was updated accordingly.