Удалить элемент из ng-repeat, который имеет анимацию перехода

0

У меня есть массив элементов в ng-repeat. Этот родительский элемент также имеет анимацию фонового перехода с длительностью 1 секунду.

Когда я удаляю элемент с помощью splice, для удаления из пользовательского интерфейса требуется 1 секунда. (В зависимости от того, какое время я даю для продолжительности перехода)

Я не хочу добавлять другой класс, чтобы сначала удалить переход, а затем удалить. Или это единственный способ?

<div class="MyTransitionClass" ng-repeat="d in myArray">     
    {{d.Value}}
    <button type="button" class="CloseIcon" ng-click="DeleteItem($index)">DELETE</button>
</div>

.MyTransitionClass {
    transition: background-color ease-in 1s;
    -webkit-transition: background-color ease-in 1s;
}
Теги:
transition
angularjs-ng-repeat

1 ответ

1
Лучший ответ

Попробуйте это так: https://docs.angularjs.org/api/ngAnimate

.MyTransitionClass.ng-enter {
    transition: background-color ease-in 1s;
    -webkit-transition: background-color ease-in 1s;
}

Рабочий jsfiddle http://jsfiddle.net/irhabi/3fgtqwgq/

  • 0
    Это хорошее решение. Но я должен был упомянуть, я также изменяю фон при изменении статуса элемента, поэтому не только на ng-enter. Поэтому я думаю, что в моем случае это было бы более уместно. .MyTransitionClass.ng-exit {transition: none; -webkit-transition: нет; } Спасибо.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню