ng-repeat中的ng-animate子元素

Question

我正在尝试为ng-repeat中的子元素设置动画。 这就是我现在拥有的。我正在使用CSS动画，但如果你知道一个不同的更好的方法，请告诉你。

的index.html

<div class="container slider" ng-controller="sliderCtrl">
        <div ng-repeat="slide in slides" class="slide" ng-include="'/partials/slider/' + slide.image + '.html'">
        </div>
</div>

01.html（包含在ng-repeat中）

<div class="slider-message-1">
    <span>message</span>
</div>

<img class="slide-image" ng-src="assets/img/img00.jpg" />

sass文件

.slide{

    &.ng-hide{

        .slider-message-1{
            display: block!important;
            visibility: hidden;
        }
    }

    &.ng-hide-remove {

        .slider-message-1{
            animation: fadeIn 2s;
            -webkit-animation: fadeIn 2s;
        }
    }

    &.ng-hide-add {

        .slider-message-1{
            -webkit-animation: fadeOut 1s;
            animation: fadeOut 1s;
            visibility: visible;
        }
    }
}