AngularJS路线变化发生在ng-leave动画结束之前

Question

我正在使用以下css代码来动画我的ui-view更改。

.fadein.ng-enter,
.fadeout.ng-leave {
  -webkit-transition: all linear 1s;
  -moz-transition: all linear 1s;
  -o-transition: all linear 1s;
  transition: all linear 1s;
  display: block !important;
}

.fadein.ng-enter {
  opacity: 0;
}

.fadeout.ng-leave {
  opacity: 1;
}

.fadein.ng-enter.ng-enter-active {
  transition-delay: 1s;
  opacity: 1;
}

.fadeout.ng-leave-active {
  opacity: 0;
}

并在此处应用于ngview：

 <div ui-view class="fadein fadeout"></div>

然而，路线变化（例如由$ state.go（“home.dashboard”）发起）总是发生，甚至在我的ng-leave动画开始之前（淡出动画）。

我尝试添加     过渡延迟：1s; 属性，但动画仍未执行。

Answer 1

我不知道为什么，但添加

position: absolute;

到我的ui-view div解决了这个问题。