如何使用angularjs处理div上的动画？

我一直在阅读AngularJS的动画，据我所知，ngAnimate模块可以与标准的Angular指令一起使用。我也知道css动画被鼓励作为第一个调用端口

为了学习Angular，我创建了一个虚拟项目，我想在单击按钮时使面板淡入，然后在再次单击时使其淡出。由于我来自jquery背景，我的典型方法是使用以下内容：

$('button').on('click', function() {

  // If box is visible
  $('.box').stop().fadeOut();


  // If box is hidden
  $('.box').stop().fadeIn();
});

然而，对于Angular，我不太确定完成同样事情的最佳方式是什么。我看过一些教程视频，这是我想出的方法。然而，我遇到的问题是，如果我快速点击按钮，它似乎会出现故障，动画会变得一团糟。我想我要问的问题是a）我淡入/淡出一个元素的方法是明智的（因为我真的想采用一种角度的思维方式）和b）我如何复制jquery的.stop（）即。我如何停止一个动画而开始另一个动画

我正在努力理解如何使用Angular制作动画，因为jquery非常简单：-）

---

谢谢

是的，在jquery中猜测凌乱是很简单的。但是angular不是jquery，所以不要再考虑jquery的方式。要回答你的

b）

问题，如果你在

ngAnimate

中使用CSS动画，你不必担心“停止”因为浏览器将只处理当前正在发生的任何变换，所以会显示动画。而且它们几乎总是比jquery/javascript动画更具性能。