W3cubDocs

Improve this Doc View Source ngAnimateSwap

directive in module ngAnimate

Overview

ngAnimateSwap is a animation-oriented directive that allows for the container to be removed and entered in whenever the associated expression changes. A common usecase for this directive is a rotating banner or slider component which contains one image being present at a time. When the active image changes then the old image will perform a leave animation and the new element will be inserted via an enter animation.

Directive Info

This directive creates new scope.
This directive executes at priority level 0.

Usage

as attribute:
```
<ANY
  ng-animate-swap>
...
</ANY>
```

Animations

Animation	Occurs
enter	when the new element is inserted to the DOM
leave	when the old element is removed from the DOM

Click here to learn more about the steps involved in the animation.

Example

© 2010–2018 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://code.angularjs.org/1.6.8/docs/api/ngAnimate/directive/ngAnimateSwap