角度:将动画与范围更改相结合

Angular: combine animation with a scope change

本文关键字：相结合 范围 动画 角度      更新时间：2023-09-26

只是想看一些代码？来了：一些代码

我的问题是，使用 Angular 如何将页面上某些数据的更改（由单击触发）与淡入/淡出动画相结合？

我可以

有一个点击更改内容，我可以有一个点击动画，但我似乎无法让两者一起工作。

具体来说，我想要一个单击将字符更改为列表中的下一个字符，但我希望字符在交换时淡入淡出，而不是简单地就地更改。

下面是一个 plunk，演示了这两种行为分别运行。检查一下，如果您能建议如何使角色通过淡入/淡出而不是他们当前的即时更改来交换，我将永远感激不尽。

你想要的是一个非标准的（不是ng-animate范式的一部分）动画。我建议编写一个简单的指令。 最终，您需要$watch更改，然后触发动画代码。因为动画代码是 dom 操作，所以它属于指令。考虑您的指令的实现

，如下所示： 
  <div cross-fade="currentchar" ></div>

这样的指令也可以通过$animator利用您现有的.animation脚本

相关文章：