2

ngAnimate当与路由一起使用时,可以设置不同的“CSS 样式”以产生不同的过渡。

这是涵盖过渡的所有 CSS 选项的正确模板吗?

myAnimation = 代表我的 CSS 模板。

.myAnimation {}
.myAnimation.ng-enter {}
.myAnimation.ng-enter-active {}
.myAnimation.ng-leave {}
.myAnimation.ng-leave-active {}

是否有任何指南或文档说明正在影响什么以及何时?

我已经玩了一段时间了,但我仍然不了解这些 CSS 项目中的每一个以及它们在动画中所扮演的角色,我指的是“绝望视图”和“新视图”。我知道这也涉及理解 CSS,但我正在寻找的是使用最简单的 CSS 来理解这一点......开发人员可以使用它从那里发展。

4

1 回答 1

6

谈到 Angular 动画,moo 年是你最好的朋友。这是 ngAnimate Matias Niemela 的作者的博客。

我将从这篇文章开始:Remastered Animation in AngularJS 1.2,但请查看他的其他帖子,例如Staggering Animations in AngularJS其他

AngularJS 1.2 中的 Remastered Animation真正涵盖了您需要了解的 Angular 动画的 99%,并提供了有关 CSS 过渡、CSS 关键帧动画以及所有支持动画的内置 Angular 指令的 JavaScript 动画的解释和示例。该框:ngView、ngInclude、ngIf、ngSwitch、ngClass、ngShow、ngHide 以及如何将其应用于您自己的自定义指令。

于 2014-01-30T21:31:24.187 回答