吳重複刪除和吳式修改不同步

我想在ng重複列表上實現自定義動畫。當一個元素被刪除時，它下面的所有元素都會上升。吳重複刪除和吳式修改不同步

這是在transform屬性上使用CSS動畫完成的。在開始時，元素並沒有真正從ng-repeat列表中移除（opacity屬性上有一個動畫）。

在某一點上，我應該從列表中刪除元素。而且，與此同時，我需要將動畫放在其他元素上，這些元素被人爲地放得太高。

下面是HTML：

<div ng-repeat="card in cards" ng-style="shouldBeUpped ? uppedStyle : ''">...</div>

這裏是JS：

$timeout(function() { 
     $scope.shouldBeUpped = false; 
     $scope.cards.splice(index, 1); 
    }, 1000);

的問題是，$scope.cards.splice(index, 1);和$scope.shouldBeUpped = false;不同步。有一個小的明顯延遲（可能是20或30毫秒），看起來非常糟糕，因爲在此期間屏幕上有空白（$scope.shouldBeUpped = false;在$scope.cards.splice(index, 1);之前呈現）。

你知道我能做些什麼嗎？

我聽說過ng-leave和ng-move類，但我在網上找到的例子不適合我...（我正在使用Angular 1.4）。

來源

2016-01-21 Arnaud

嘗試創建簡單的plunk/fiddle（順便說一下，調用$ timeout中的apply是沒有意義的） –

我認爲你的問題是$超時。你在那裏增加1秒延遲。

我不知道如何查看可能知道$ scope.shouldBeUpped = false;早於$ scope.cards.splice（index，1）;因爲所有的變化都反映了$ scope。$ apply（）

來源

2016-01-21 14:15:49

我需要$ timeout，因爲我想等待在實際移除元素之前進行CSS動畫的結束。 – Arnaud

@Arnaud什麼觸發你的動畫？我認爲$ scope.shouldBeUpped = false;那是嗎？ –

吳重複刪除和吳式修改不同步

回答

相關問題