Q:

Only the first element in ngRepeat is animated

If I load async data in my app. NgRepeat only animates the first element in an array.
jsFiddle
html:
<div ng-repeat="x in data"></div>

css:
.box.ng-enter {
    -webkit-transition: all 2s ease;
    transition: all 2s ease;
    opacity: 0;
    top: 20px;
}

.box.ng-enter-stagger {
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

.box.ng-enter.ng-enter-active {
    opacity: 1;
    top: 0;
}

In this example I use $timeout to simulate an async datasource.
Why is that.
Thanks!

A:

My guess is this was a bug that has since been fixed. There have been a large number of changes to the animate module since the 1.2.* release.
Here is a JsFiddle that has the latest source from git for the animate module embedded and the issue has gone away. If you need this functionality then it is probably best for you to load in your own version of the animate module using the latest source.
Here you can compare the 1.2.* branch to the master branch look for "src/ngAnimate/animate.js" to see all the changes to the module.
Ignore - needed to get the fiddle link to work i get the motivation
behind requiring code along with a fiddle but in this case it actually makes
little sense the only modification made to the original was the addition of
1600 lines of code taken from the latest version of the module. I'm not
putting that in here.

