This repository has been archived by the owner on May 29, 2019. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 6.7k
Modal close animation not working #1341
Labels
Comments
EDIT: This is only as a reference not a solution to the problem After a little bit of digging around I found this plunk: http://plnkr.co/edit/nZT58YNKT84UlSwTvfpc?p=preview It uses Angular UI Bootstrap 0.5.0 (which doesn't have $modal, but does have $dialog) and both the open and close animations work (the "in" class gets removed on exit and when the animation finishes, the element gets removed from the DOM). |
@crisbeto $modal is a rewrite of $dialog which had multiple design and implementation issues. There is no turning back, $modal needs to be fixed so support closing animations. |
chrisirhc
added a commit
to chrisirhc/angular-ui-bootstrap
that referenced
this issue
Dec 16, 2013
Tests now have to wait for animation before checking for open modals. Tests should actually check for the 'in' class. Setting up both the transition end handler and a timeout ensures that the modal is always closed even if there was an issue with the transition. This was the implementation used by Twitter Bootstrap modal JS code. Note that unbinding the transition end event within the event handler isn't necessary, and, worse is currently buggy in jqLite (see angular/angular.js#5109 ). Closes angular-ui#1341
chrisirhc
added a commit
to chrisirhc/angular-ui-bootstrap
that referenced
this issue
Dec 24, 2013
Tests now have to wait for animation before checking for open modals. Tests should actually check for the 'in' class. Setting up both the transition end handler and a timeout ensures that the modal is always closed even if there was an issue with the transition. This was the implementation used by Twitter Bootstrap modal JS code. Note that unbinding the transition end event within the event handler isn't necessary, and, worse is currently buggy in jqLite (see angular/angular.js#5109 ). Note that the scope is already destroyed when the dom is removed so the $destroy call isn't needed. Closes angular-ui#1341
chrisirhc
added a commit
to chrisirhc/angular-ui-bootstrap
that referenced
this issue
Dec 24, 2013
Tests now have to wait for animation before checking for open modals. Tests should actually check for the 'in' class. Setting up both the transition end handler and a timeout ensures that the modal is always closed even if there was an issue with the transition. This was the implementation used by Twitter Bootstrap modal JS code. Note that unbinding the transition end event within the event handler isn't necessary, and, worse is currently buggy in jqLite (see angular/angular.js#5109 ). Note that the scope is already destroyed when the dom is removed so the $destroy call isn't needed. Closes angular-ui#1341
chrisirhc
added a commit
to chrisirhc/angular-ui-bootstrap
that referenced
this issue
Dec 24, 2013
Tests now have to wait for animation before checking for open modals. Tests should actually check for the 'in' class. Setting up both the transition end handler and a timeout ensures that the modal is always closed even if there was an issue with the transition. This was the implementation used by Twitter Bootstrap modal JS code. Note that unbinding the transition end event within the event handler isn't necessary, and, worse is currently buggy in jqLite (see angular/angular.js#5109 ). Note that the scope is already destroyed when the dom is removed so the $destroy call isn't needed. Closes angular-ui#1341
chrisirhc
added a commit
to chrisirhc/angular-ui-bootstrap
that referenced
this issue
Dec 24, 2013
Tests now have to wait for animation before checking for open modals. Tests should actually check for the 'in' class. Setting up both the transition end handler and a timeout ensures that the modal is always closed even if there was an issue with the transition. This was the implementation used by Twitter Bootstrap modal JS code. Note that unbinding the transition end event within the event handler isn't necessary, and, worse is currently buggy in jqLite (see angular/angular.js#5109 ). Note that the scope is already destroyed when the dom is removed so the $destroy call isn't needed. Closes angular-ui#1341
chrisirhc
added a commit
to chrisirhc/angular-ui-bootstrap
that referenced
this issue
Dec 24, 2013
Tests now have to wait for animation before checking for open modals. Tests should actually check for the 'in' class. Setting up both the transition end handler and a timeout ensures that the modal is always closed even if there was an issue with the transition. This was the implementation used by Twitter Bootstrap modal JS code. Note that unbinding the transition end event within the event handler isn't necessary, and, worse is currently buggy in jqLite (see angular/angular.js#5109 ). Note that the scope is already destroyed when the dom is removed so the $destroy call isn't needed. Closes angular-ui#1341
chrisirhc
added a commit
to chrisirhc/angular-ui-bootstrap
that referenced
this issue
Jan 6, 2014
Tests now have to wait for animation before checking for open modals. Tests should actually check for the 'in' class. Setting up both the transition end handler and a timeout ensures that the modal is always closed even if there was an issue with the transition. This was the implementation used by Twitter Bootstrap modal JS code. Note that unbinding the transition end event within the event handler isn't necessary, and, worse is currently buggy in jqLite (see angular/angular.js#5109 ). Note that the scope is already destroyed when the dom is removed so the $destroy call isn't needed. Closes angular-ui#1341
chrisirhc
added a commit
to chrisirhc/angular-ui-bootstrap
that referenced
this issue
Jan 6, 2014
Tests now have to wait for animation before checking for open modals. Tests should actually check for the 'in' class. Setting up both the transition end handler and a timeout ensures that the modal is always closed even if there was an issue with the transition. This was the implementation used by Twitter Bootstrap modal JS code. Note that unbinding the transition end event within the event handler isn't necessary, and, worse is currently buggy in jqLite (see angular/angular.js#5109 ). Note that the scope is already destroyed when the dom is removed so the $destroy call isn't needed. Closes angular-ui#1341
chrisirhc
added a commit
to chrisirhc/angular-ui-bootstrap
that referenced
this issue
Jan 6, 2014
Tests now have to wait for animation before checking for open modals. Tests should actually check for the 'in' class. Setting up both the transition end handler and a timeout ensures that the modal is always closed even if there was an issue with the transition. This was the implementation used by Twitter Bootstrap modal JS code. Note that unbinding the transition end event within the event handler isn't necessary, and, worse is currently buggy in jqLite (see angular/angular.js#5109 ). Note that the scope is already destroyed when the dom is removed so the $destroy call isn't needed. Closes angular-ui#1341
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
The modal and the modal backdrop don't trigger css transitions when they're being closed. They both have ng-class="{in:animate}", however the element just gets removed when $modalInstance.close() gets called. There's no such problem when the modal is being opened.
It can be seen in the official demo: http://plnkr.co/7FM01InF2tEi2Imgb07W
The text was updated successfully, but these errors were encountered: