测试用例:http://plnkr.co/edit/dsG3gxFomAK8Q15Xfouj?p=preview
上面的测试用例是使用ng-repeat
指令呈现的数据列表,两次。一次不使用ng-include
,一次使用ng-include
。
为ng-repeat
指令支持的所有三个(输入,离开和移动)动画设置CSS过渡。当不使用ng-include
时,所有三个动画都能正常工作,但只有输入动画才能使用ng-include
加载每个项目的模板列表。
我很确定这是angular-animate
的错误,但不确定。使用ng-repeat
和ng-include
组合时,我可能会做错事。我尝试挖掘angular-animate
源代码并修复问题,但不能。我想的(希望是真的)是ng-include
指令在ng-repeat
呈现的每个项目的正上方添加了一个注释节点,这个节点正在抛弃angular-animate
的工作。这也是两种实现之间唯一明显的区别。
请注意,如果没有设置动画,所有功能都可以正常工作。但是在使用ng-include
的示例中,不仅动画(用于向上或向下移动项目)搞砸了,而且项目甚至都没有移动。
这是一个错误吗?如果是这样,是否有已知的解决方法?我尝试在github上搜索angular.js的问题,但找不到解决方法(我发现的那些不起作用)。感谢您对此提供任何帮助。
答案 0 :(得分:1)
但是当使用ng-include加载列表中每个项目的模板时,只有输入动画才有效。
我实际上在Chrome中遇到了不一致的行为。有时移动的动画会起作用。
如果是,是否有已知的解决方法?
您可以嵌套ng-repeat-ed / ng-include-ed元素,因此指令位于不同的元素上,因此不管是什么原因都不应该有任何冲突。 http://plnkr.co/edit/dVniIVUaGS8y7wHe7CuT?p=preview
上的示例编辑:修复了plnkr链接。