Angular.js устанавливает логическую переменную области видимости, когда анимация происходит через директиву пользовательского интерфейса UI-Router

Question

Я использую директиву ui-view ui-router и ng-animate 1.3.8, чтобы добавить переход страницы CSS, когда содержимое ui-view обновляется при изменении состояния. У меня переход работает отлично, но теперь я хотел бы определить логическую переменную в $rootScope, которая установлена ​​в true в то время как происходит анимация пользовательского интерфейса и false иначе.

Каков угловой способ сделать это? Я попытался определить новую анимацию с тайм-аутом, установленным на тот же период времени, что и переход css, а затем прикрепить ее к элементу пользовательского интерфейса, но кажется, что он работает только периодически. Это также кажется совершенно плохой практикой, поэтому я стремлюсь знать правильный путь. Смотрите код ниже:

В HTML:

<div ui-view="main" class="trans-timer"></div>

Анимация:

.animation('.trans-timer', function($timeout, $rootScope) {
  return {
    enter : function(element, done, memo) {
      $rootScope.isAnimating = true;
      $timeout(function () {
        $rootScope.isAnimating = false;
      }, 500);
     }
   };
})

Благодарю.