角度ui-router动画子状态改变但不是孙子

时间:2016-05-10 16:38:29

标签: angularjs angular-ui-router ng-animate

我有一个带有主要抽象视图和嵌套子视图的角应用程序。其中一个主要观点的孩子也是抽象的,有自己的儿童观点。

当我更改主要父级的子状态时,动画可以正常工作,但是当我改变孙子的状态时,没有动画。

在查看开发人员工具时,我发现当孩子状态发生变化时会添加ng-enter和ng-leave类,而不会在孙子变化时添加。

这是展示行为的plunker

1 个答案:

答案 0 :(得分:2)

这与CSS规则的编写方式有关,您使用.ng-enterng-leave的属性选择器抓取ui-view,但将ui视图指令声明为元素和html中的属性。所以你应该做更像这样的事情:

ui-view.ng-enter, [ui-view].ng-enter { // animation }

以下是plunkr

的工作分支