angularjsng-animateui.bootstrap

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?


Solution

  • 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.