Search code examples
javascriptangularjsangular-strap

AngularStrap modal is empty?


I am trying to create a modal using Angular Strap library:

http://plnkr.co/edit/fXOIAoYMpgzLK4xsvrxG?p=preview

When I run it, I get empty modal, and $promise.then this being called before I close the modal.

What am I doing wrong?


Solution

  • A few issues:

    • I wasn't able to get this to work without specifying the modal inside a controller, so I created one.
    • Seems like Angular Strap documentation doesn't know what they're talking about. I swapped from using templateUrl to using template, even though the docs say either should work. Weird.
    • From docs, Modal -> Options -> "It should be a div.modal element following Bootstrap styles conventions (like this)." with a link leading to https://github.com/mgcrea/angular-strap/blob/master/src/modal/modal.tpl.html. So basically you'll need you modal to have all these divs defined around the actual modal-header, modal-body etc.
    • The $promise.then part is working as intended; the docs say in an example comment //Show when some event occurs (use $promise property to ensure the template has been loaded) so all it does is ensure that the code inside the then function is executed after the modal template has been loaded. You'll likely need a separate handler for your Activate and Close buttons.

    Hopefully this helped! Working plunker here: http://plnkr.co/edit/7aNmIK0WTV6aU5raABdQ?p=preview