angularjs - 在 ng-enter 之前类未绑定(bind)到 ui-view

Question

为了在状态之间实现不同的动画 - 我根据当前状态将一个类应用于 ui-view:

<div ng-class="currentClass.current.name" ui-view></div>

这有效，但是 - 最初当 View 进入时，看起来 ng-enter 在 currentClass.current.name 中的类被绑定(bind)之前应用，所以我的动画被忽略:

.slide-right.ng-enter {
  z-index: 100;
  left: -100%;
  background-color: green;
}

我可以将动画应用于 ng-leave - 因为 currentClass.current.name 在此之前已应用。

参见plunker code for example 。有什么想法吗？

Answer 1

CSS classes managed by ng-class conflict with ALL ui-view animations.

所以，问题就在这一行

<section ui-view ng-class="stateClass"></section>

不幸的是，ng-class 与 ui-view 不兼容。这是完整的issue .

因此您可以将 class="{{stateClass}}" 与 ui-view 一起使用。

<section ui-view class="{{stateClass}}"></section>

这里正在工作 plunker

干杯!