#42 Proper modal cleanup with Bootstrap

[Anonymous]

Originally created by: cehoffman
Originally owned by: dwmkerr

I looked through the examples to see if there was already a documented way of properly cleaning up a modal that is dismissed when clicking outside the modal area. I didn't see anything and noticed there were many ng-click directives used to catch the modal closing.

Instead of attaching ng-click directives to all the elements and faking the animation time for the modal to disappear I used the events generated by bootstrap. I inserted this at the top of my controller to make sure the modal is properly cleaned up regardless of how it is closed and waits for the animation to finish. This handles clicking outside the modal to close, data-dismiss="modal", and $element.modal('hide').

$element.on('hidden.bs.modal', close)

I thought this might be useful documentation in the FAQ.

[Anonymous]

Originally posted by: dwmkerr

This looks awesome, much easier than having to message around with a timeout for animations (which would coincidentally fix [#4] I think. I'll look into getting this into the samples and documentation ASAP. Thanks for sharing @cehoffman

[Anonymous]

Originally posted by: gaui

Awesome solution, well done! 👍