Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What's wrong with ngAnimate and ui.bootstrap modal?

In this example

http://plnkr.co/edit/ETwexjK0HRu3b8WovoJq

angular.module('animateApp', [
  'ngAnimate', // adding this causes issue with modal backdrop
  'ui.bootstrap'
])

When you close modal, the backdrop won't go away. If I comment out the 'ngAnimate' dependency (script.js line 4), it works just fine.

Am I doing something wrong or is this a bug in ui.bootstrap when used with ngAnimate?

like image 484
Reynard Avatar asked Jun 03 '15 02:06

Reynard


1 Answers

It appears to be a breaking change somewhere between Angular 1.3.15 and 1.4.0. Apparently something in ngAnimate changed that interferes with the backdrop hiding. If you turn off the animation, the backdrop hides fine:

$scope.openModal = function() {
    $modal.open({
      templateUrl: 'modal.html',
      controller: 'ModalCtrl',
      backdrop: true,
      animation: false
    });
  }

If you drop down to 1.3.15, there is no issue: Plunker

If you check the dependencies page for ui-bootstrap, it doesn't look they have quite caught up to 1.4.0 yet: https://david-dm.org/angular-ui/bootstrap#info=devDependencies

It may be worth posting an issue or seeing if someone has already.

like image 50
tpie Avatar answered Nov 12 '22 07:11

tpie