Динамическое изменение имени класса анимации входа/выхода

Просто создайте несколько классов анимации в своей таблице стилей, а затем переключите их с помощью ng-class на основе любой переменной из vm, которая вам нравится. Ниже может быть ваша разметка:

<ul>
  <li ng-repeat="item in vm.items track by item.id"
      ng-class="{
        'animation-1-class': vm.varOfYourChoice,
        'animation-2-class': !vm.varOfYourChoice
      }"
  ></li>
</ul>

И ваша таблица стилей:

.animation-1-class.ng-enter,
.animation-1-class.ng-leave.ng-leave-active { ... }

.animation-1-class.ng-leave,
.animation-1-class.ng-enter.ng-enter-active { ... }

.animation-2-class.ng-enter,
.animation-2-class.ng-leave.ng-leave-active { ... }

.animation-2-class.ng-leave,
.animation-2-class.ng-enter.ng-enter-active { ... }

И здесь находится соответствующая документация по угловой анимации для версии AngularJs. вы используете.

Проблема заключалась в том, что если я создаю css с тем же именем, что и animation.css, анимация.css всегда вступает во владение, поэтому я просто добавляю префикс к своему классу, и это устраняет проблему.