how to use animation with ng-repeat in angularjs

Rishul Matta提出了一个问题：how to use animation with ng-repeat in angularjs，或许与您遇到的问题类似。

回答者Rémi Becherasz0r给出了该问题的处理方式：

Following on from Marcel's comment: in AngularJS 1.2 you don't need to use the ng-animate directive. Instead:

1. Includeangular-animate[-min].js.
2. Make your module depend on ngAnimate.
3. Define your transitions in CSS using classes like .ng-enter and .ng-enter-active.
4. Use ng-repeat as you normally would.

HTML:

<div ng-app="foo">
    <!-- Set up controllers etc, and then: -->
    <ul>
        <li ng-repeat="item in items">{{item}}</li>
    </ul>

JavaScript:

angular.module('foo', ['ngAnimate']);
// controllers not shown

CSS:

-- -------------------- ---- -------
-- -
    -------- --
-
----------- -
    ------------------- ---
    ----------- ---
    -------- --
-
------------------ -
    -------- --
-

Demo in (someone else's) Plunker.

See the docs for $animate for details on the progression through the various CSS classes.

希望本文对你有帮助，欢迎支持JavaScript中文网

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/29040