Как вызвать ng-move с угловым анимацией при переупорядочивании массива?

Question

Использование углового 1.2.4 Я пытаюсь выяснить, как вызвать движение ng-animate, когда повторяющийся элемент переупорядочен. Я знаю, что ng-animate работает, потому что анимация для ввода, отпуска и перемещения запускается, когда применяется фильтр. Однако, когда я использую некоторые методы массива для изменения порядка массива, анимации не запускаются. Я подозреваю, часть проблемы заключается в том, что я на самом деле удаление и добавление элементов в массиве с помощью этого метода, на самом деле не «движется» их:

$scope.moveDown = function(order){ 
    var temp = $scope.names[order]; 
    $scope.names.splice(order, 1); 
    $scope.names.splice(order+1, 0, temp); 
    } 

Вот это plunker, который показывает, что я до: http://plnkr.co/edit/SuahT6XXkmRJJnIfeIO1?p=preview

Нажмите на любое из названий, чтобы оно перемещалось по списку.

Есть ли способ изменить порядок массива без сращивания? Или же вручную запустить анимацию перемещения при изменении индекса $ item?

Answer 1

Попробуйте дать разрыв (в пищеварении) между удаления и вставки, которые получат ng-enter и ng-leave анимации пнуть в.

var temp = $scope.names.splice(order, 1).pop(); 
    $timeout(function(){ 
     $scope.names.splice(order+1, 0, temp); 
    }); 

Plnkr

Если вы хотите, чтобы избежать использования тайм-аута , немного перестройте свои данные, сделайте массив массивов (который всегда всегда нужен) и выполните: -

ViewModel: -

$scope.names = [{'name':'Igor Minar'}, {'name':'Brad Green'}, {'name':'Dave Geddes'}, {'name':'Naomi Black'}, {'name':'Greg Weber'}, {'name':'Dean Sofer'}, {'name':'Wes Alvaro'}, {'name':'John Scott'}, {'name':'Daniel Nadasi'}]; 

В обработчике: -

$scope.moveDown = function(order){ 
    var itm = $scope.names.splice(order+1, 1).pop(); //Get the item to be removed 
    $scope.names.splice(order, 0, angular.copy(itm)); //use angular.clone to get the copy of item with hashkey 
    } 

2 вещи важны здесь, вам нужно будет использовать angular.clone так что свойство трекер по умолчанию ($$hashkey) будут удалены из пункта переключения, то похоже, только когда элемент удален и новый элемент вставлен (на основе свойства трекера) угловым добавляет к нему классы анимации. Вы не можете сделать это с примитивным, как вы изначально были.

Plnkr2