Buenas tardes, esto me esta haciendo perder toda la mañana, lo que quiero conseguir es que se ejecute una animación cada vez que ocurra el ng-repeat para que los bloques que genero aparezcan poco a poco, pero no se porque no funciona.
Ahora mismo esta funcionando asi:
http://recordit.co/nZRpaebWzm
Este es el html:
<div class="blocks-container" ng-init="loadProjects()" ng-controller="buildMonitorController">
<div class="row">
<div>
<div class="col-xs-12 col-sm-6 col-md-3 col-lg-2 block" ng-repeat="build in builds.builds.build | orderBy:'lastBuildDetails.startDate' : true" ng-animate="{enter: 'block-enter'}" style="transition-delay:500ms" ng-class="{'running': project.running ,'block-green': build._status ==='SUCCESS','block-red': build._status==='FAILURE'}" id="{{build._id}}">
<div class="title-container"><p>{{build._buildTypeId}}</p></div>
<div class="update-container col-xs-12">
<time>{{ build.lastBuildDetails.startDate | date : 'dd.MM.yyyy H:mm:s'}}</time>
</div>
</div>
</div>
</div>Estas son las reglas css:
.block-enter {
opacity:0;
-webkit-transition-property: all;
-webkit-transition-timing-function: ease-out;
-webkit-transition-duration: 400ms;
}
.block-enter.block-enter-active {
opacity: 1;
}