AngularJS CSS3動畫爲NG-重複

Question

我的CSS是：

.fade-in-repeat { 
    -webkit-animation: fadein 2s; /* Safari and Chrome */ 
     -moz-animation: fadein 2s; /* Firefox */ 
     -ms-animation: fadein 2s; /* Internet Explorer */ 
     -o-animation: fadein 2s; /* Opera */ 
      animation: fadein 2s; 
} 

@keyframes fadein { 
    from { opacity: 0; } 
    to { opacity: 1; } 
} 

/* Firefox */ 
@-moz-keyframes fadein { 
    from { opacity: 0; } 
    to { opacity: 1; } 
} 

/* Safari and Chrome */ 
@-webkit-keyframes fadein { 
    from { opacity: 0; } 
    to { opacity: 1; } 
} 

/* Internet Explorer */ 
@-ms-keyframes fadein { 
    from { opacity: 0; } 
    to { opacity: 1; } 
}​ 

/* Opera */ 
@-o-keyframes fadein { 
    from { opacity: 0; } 
    to { opacity: 1; } 
}​ 

我的HTML是：

<tr class="fade-in-repeat" ng-repeat="transaction in transactions | orderBy:transaction.time"> 
    <td> 
     <div class="row"> 
     <div class="col-lg-6"> 

因此，作爲被添加的項目，我希望他們淡出的問題是有一個FUOC在動畫踢之前，這使得它看起來像它的閃爍

Answer 1

只需添加opacity:0到.fade-in-repeat的CSS

Demo