angularjs - 在 IONIC 中使用 ng-show 进行幻灯片切换

Question

这是代码笔 http://codepen.io/lakhan/pen/cukyL

我有一个带有 ng-repeat 的元素列表，我一次显示一个元素。 单击下一步显示列表中的下一个元素。 现在我想要实现的是当我点击下一步时在 Item 上滑动过渡。 CSS 方面我缺少一些东西。任何帮助将不胜感激。

Answer 1

这是一个代码笔，它可以做我想你想要的:http://codepen.io/anon/pen/ijLFq

在 AngularJS >= 1.2 中不再支持 ng-animate 指令。对于基于 ng-show 的动画，您必须使用 ng-hide-add、ng-hide-remove CSS 类而不是 CSS 类在 ngRepeat 文档中描述。有关详细解释，请参阅:http://www.yearofmoo.com/2013/08/remastered-animation-in-angularjs-1-2.html#animating-ngshow-and-ng-hide

为了达到预期的效果，我不得不使用 CSS3 动画。使用 CSS3 过渡时，我无法重新创建效果，因为无法使用提供的动画辅助类​​使用过渡建模从左侧滑出和从右侧滑入。

理解 CSS3 动画和过渡以及它们之间的差异非常难以理解。本站CSS3 Transitions, Transforms, Animation, Filters and more!对我帮助很大。