Angular 1.2 - ngAnimate未應用.ng-move class

Angular的animate-repeat在應用時看起來不像應用ng-move類，所以我很困惑，無法創建我想要的動畫。Angular 1.2 - ngAnimate未應用.ng-move class

我用NG-重複正在與自定義過濾器，以從一個水平行添加和刪除的div：

<div id="presidents"> 
    <div ng-repeat="president in presidents | showPresident:this" class="pres animate-repeat" id="{{ president.birth }}" > 
    <a href="{{ president.url }}" target="_blank"> 
     <img src="{{ president.imageURL }}" alt="{{ president.name }}"> 
    </a> 
    <p>{{ president.name }}</p> 
    </div> 
</div>

我試圖創建時的div相加，從DOM中移除動畫。 ng-repeat的Angular文檔有三種可用於此類動畫的類：ng-enter，ng-leave和ng-move。我已經將CSS動畫應用於進入和離開課程，以便divs淡入淡出。

.ng-enter { 
    animation: zoomIn 1s; 
} 

.ng-leave { 
    animation: zoomOut 1s; 
}

當一個div中消失或縮小，不過，該有的都有滑入或讓開，而且好像而這種情況發生，這樣我可以動畫的過程中NG-移動類應適用，但這個班級從來沒有應用過，所以divs只是簡單地停下來，而不是按照我想要的方式滑行。我證實，這個班級從來沒有通過給它一個紅色的邊界應用：

.ng-move { 
    border: 4px solid red; 
}

所以，我誤解ng-move？爲什麼它們在重新定位時不適用於其餘的divs？

如何讓這些div滑過而不是貼緊？

來源

2015-02-12 Austin Brown

希望這兩個鏈接可以解決這個問題：https：//github.com/angular/angular.js/issues/5160和http://stackoverflow.com/a/27616435/2887841 – tasseKATT 2015-02-12 10:38:11

@tasseKATT謝謝。 – 2015-02-13 14:23:40

我最終使用的解決方案是動畫自己的寬度和不透明度，而不是使用animate.css。隨着他們縮小尺寸，其他人滑入到位。看起來很奇怪的文字，但與圖像很好地工作。不需要ng-move類。

來源

2015-02-13 14:28:15

Angular 1.2 - ngAnimate未應用.ng-move class

回答

相關問題