angularjs - 「enter」イベントで ngRepeat の子要素をアニメーション化します。データ初期化のアニメーションを回避するにはどうすればよいですか?

Question

// please refer to the jsfiddle link below for the complete code.

ここにjsfiddleがあります。基本的に、アニメーションは思い通りに動作しますが、データの初期化のために発生させたくありません。私は何をしますか？

angularjsコントローラーでDOMオブジェクトにアクセスするようなハックよりも、この状況に対処する適切な方法を見たいと思っています。

更新 1:

ngClassアニメーションにスイッチを実装するために使用してみましたが、そのシンプルさが気に入っています。ただし、問題は、アニメーションがディレクティブを持つ要素に適用されるngRepeat場合にのみ、このアプローチが何らかの形で機能することですが、この特定のシナリオでは、の子要素でアニメーションを発生さngRepeatせる必要があります。

score 0 · Accepted Answer

ng-classの場合にのみ存在する「新しい」クラスを設定するために使用できますuser.name == 'New User'。次に、「新しい」クラスを持つユーザーにのみアニメーションを適用します。例えば：

<div class="user-name" style="display:inline-block" ng-class="{new: user.name == 'New user'}">

次に、CSSで、

.user-entry.ng-enter .new {
    background: #5da423;
}

2 に答える 2