ngAnimate Ionic V1アプリケーションにng-enterクラスを追加していません

Question

私はイオンv1アプリを持っています。要素にng-repeat経由でビューに追加されるとき、基本アニメーションを追加したいと思います。ドキュメントを読むには、要素にCSSアニメーションを追加するために使用できるng-enterクラスが必要ですが、そうではありません。

ngAnimateは、Ionicに含まれています。私はモジュールをロードしています：

angular.module('app', [ 
    'ionic', 
    'ngAnimate', 

は、ここで使用するビューコードですng-repeat：私は動的に$scope.messagesあなたが期待するとして、それがビューに追加されますにメッセージを追加

<div class="entry" ng-repeat="message in messages | orderBy:'-id'">{{message}} 
</div> 

が、それはしていませんドキュメントに従ってそれがするべきであるng-enterクラスが含まれています。

私はイオンバージョン1.3.3、角度1.5.3およびngAnimate 1.5.3を使用しています。ここで

は、問題を示すcodepenです：https://codepen.io/jamesjacobs/pen/YQyaZq

私は何をしないのですか？ありがとう。ここで

Answer 1

はビューでイオン

でngAnimateを使用する方法である

<ion-item class="chat-item item-remove-animate item-avatar item-icon-right" ... 

CSSあなたはchat-itemクラスでそれを使用するには、以下のようにそれを使用したい場合は

.chat-item.ng-enter { 
    -webkit-animation: fadeInLeft 1s; 
    animation: fadeInLeft 1s; 
} 

上記のコードの

は、リスト全体を一度にアニメーション表示します。あなたが遅延して1つの使用ng-enter-staggerによって返信用の200ms

.chat-item.ng-enter-stagger { 
    -webkit-animation-delay:200ms; 
    animation-delay:200ms; 

    /* override to make sure it's not inherited from other styles */ 
    -webkit-animation-duration:0; 
    animation-duration:0; 
} 

デモ