Angular Bootstrap Modal leaves backdrop open

Question

I'm using AngularUI to integrate Bootstrap components in my Angular 1.4 app, such as Modals.

I'm calling a Modal in my controller like so:

var modalInstance = $modal.open({
  animation: true,
  templateUrl: '/static/templates/support-report-modal.html',
  controller: 'ModalInstanceCtrl'
});

Unfortunately, when I want to close the Modal by using:

modalInstance.close();

The modal itself dissapears, and the backdrop also fades out, but it isn't removed from the DOM, so it overlays the whole page leaving the page unresponsive.

When I inspect, I'm seeing this:

In the example in the Documentation on https://angular-ui.github.io/bootstrap/#/modal The class modal-open is removed from body and the whole modal-backdropis removed from the DOM on close. Why is the Modal fading out but the backdrop not removed from the DOM in my example?

I've checked out many of the other questions about the backdrop of bootstrap Modals but I can't seem to figure out what's going wrong.

Answer 1

This is apparently due to a bug. AngularUI doesn't support Angular 1.4 yet. Once http://github.com/angular-ui/bootstrap/issues/3620 is resolved this will work.