javascript - AngularJS でコレクションを更新するときの素敵なトランジションの追加

Question

コレクションを更新するときにエフェクトを追加するにはどうすればよいでしょうか

<li ng-repeat="item in items | filter:filterFunction">
{{item.name}}
</li>

itemsはコレクションで、たとえば 30 です。

このリストには、filterFunctionを検証するアイテムのみが表示されます。スコープは定期的に更新されます。

動作しますが、少し暴力的です。

jquery を使用してトランジションを追加すると効果的です (フェードインとフェードアウト)。

Answer 1

angular-ui の animate ディレクティブを見てください

http://angular-ui.github.com/#directives-animate

あなたがやろうとしていることを達成するのに役立つはずです。お知らせしておくと、angular チームは、次のメジャー リリースで ng-repeat と ng-switch のアニメーションをサポートすることを約束しています。ですから、それまで指を交差させておいてください。