问题标签 [angularjs-animation]

Angularjs 1.2.6 场景：2 个输入，1 个文本框（听起来有点脏）。输入都会触发模糊/焦点事件的显示/隐藏转换，如果从一个输入单击到另一个输入，焦点总是在模糊之后出现。甚至文本绑定也会显示正确的当前状态（显示 =true或false）。

样式类.fade来自.in引导程序。他们有一个 CSS3 过渡，但在小提琴中我保持简单（不包括 bootstrap.css）。

info.show打开焦点/模糊事件。

jsfiddle

没有 ngAnimate 它可以完美运行。当 ngAnimate 作为依赖项添加时，转换停止正常工作。在 jsfiddle 中，只需删除 ngAnimate （留下一个空数组），它就可以正常工作。

只需单击一个输入：文本框淡入。现在直接单击另一个输入：文本正确更新，但框仍然淡出。

提交了错误报告，但与此同时我正在寻找解决方法。有建议吗？

使用 AngularJS，我想对从另一个列表添加到一个列表中的元素进行动画处理，因为在元素的克隆中应该出现从项目菜单在页面中移动，并被添加到目标列表中。

添加项目的功能在哪里进行简单的推送

你可以在这个 Plunker 看到这个动作（没有动画）

我考虑过自定义指令和事件，但没有真正得到任何地方。什么是一个好的指令和/或事件结构来允许实现这个运动动画，并尽可能地将它与添加到列表的业务分开？

注意：我在业务逻辑和动画方面的确切情况有点不同，但我希望解决方案足够灵活，允许在“移动”动画期间对菜单中发生的内容进行一些更改/添加，并且目标列表中发生了什么。

我有一个这样的 HTML 模型

如何在 Togglemenu 功能的控制器中访问#menu 点或调用我在模型中引用菜单的 ng 动画？还是我必须在#menu 的ng-hide 之上添加动画？因为我有 jQuery 背景，所以我对 AngularJS 动画的工作方式有点迷茫。但我根本不想使用 jQuery，否则我永远不会以正确的方式学习 Angular。只是为了记录，我想使用 javascript 而不是 css 关键帧动画。

我目前正在尝试在 Angular.js 中制作 CSS3 动画。
在制作动画之前，我尝试使用 Javascript 设置初始 css 属性。
那么，有没有办法使用 Javascript 初始化动画，然后使用 CSS3 继续动画？

我的情况：
当用户点击一个 div 时，应该会出现一个对话框。对话框应该完全从原始 div 开始（相同大小，相同位置），然后增长到更大的大小。

我能够从预定义的位置和大小为对话框设置动画：

CSS：

我想从单击的 div 的大小开始为对话框设置动画。到目前为止，我的代码（尚未工作）如下所示：

HTML：

Javascript：

我宁愿在没有 jQuery 的情况下这样做，以保持页面重量较低。

问候， 亨德里克·扬

看到这个 JSFiddle：http: //jsfiddle.net/5mUsH/3/

我正在尝试在 AngularJS 和 jQuery 中制作一个非常简单的 JavaScript 动画。（我没有使用 CSS 动画，因为我想支持较旧的浏览器并且还可以制作更复杂的动画。）小提琴中的代码来自 AngularJS 用户指南（但略有简化）： http ://docs.angularjs.org/指南/动画

但是——不行！DOM 会立即更新（没有动画）。有任何想法吗？谢谢！

这是来自 JSFiddle 的相关标记：

和 JavaScript：

我遇到了嵌套指令的问题，尤其是在 hide-element 指令中。

首先，有一个编辑模式指令似乎不适用于 ngAnimate。它仍然会在按钮上点击 addClass fade ，但不会绑定 ng-animate 。

我尝试将隐藏元素移动到 divColumn 处的同级元素，并且 edit-element 指令有效并且在按钮和 divColumn 上执行动画。

当它们嵌套时它不起作用。这是为什么？

（我是AngularJS的新手，请赐教）

HTML

角

这是jsfiddle。基本上，动画按我想要的方式工作，但我不希望它发生在数据初始化中。我该怎么办？

我更喜欢看到处理这种情况的正确方法，而不是像访问 angularjs 控制器中的 DOM 对象这样的黑客攻击。

更新 1：

我尝试过使用ngClass来实现动画的开关，我喜欢它的简单性。然而，问题是这种方法仅在动画应用于带有ngRepeat指令的元素时才有效，但在这种特殊情况下，我需要动画发生在的子元素上ngRepeat。

我正在构建一个包含许多幻灯片的应用程序，并且我正在使用 Angular JS 来切换触发 CSS 动画的元素上的类。我遇到的问题是，当单击一个按钮触发角度控制器上的一个函数时，该函数会更新确定元素类的 $scope 属性，导致动画开始的属性似乎在元素旧之前更新类被删除，并分配了新的类，所以元素总是只向一个方向移动。

我想要发生的是当从slide1调用proceed（）函数时，让slide2从右向左滑入，它可以正确执行，但是当通过单击幻灯片2上的“后退”按钮调用backToOne函数时， slide2 应该向右滑出。

实际发生的是，当调用 backToOne() 函数时，slide2 滑到左侧。任何帮助表示赞赏。我对角度很陌生，所以我试图弄清楚我需要做什么来更新该类，然后更改导致动画发生的属性值。

提前致谢。

这是（简化的）视图：

这是（同样，简化的）控制器：

这是CSS：

这是它的（总）plunkr： http ://plnkr.co/edit/hSUEQDkVMSdwX2nPEFly?p=info

从这个 jsfiddle 可以看出：

http://jsfiddle.net/robcampo/pWGuS/

我正在尝试使用 Angular 动画淡出一个元素并淡出另一个元素。

褪色（使用不透明度和过渡）有效。但是，正如您将看到的，它会先显示先前隐藏的元素，然后再隐藏当前显示的元素。这样一来，您就可以同时展示这两个元素。

问题

有没有办法等到第一个元素完全隐藏后再显示第二个元素？很确定我可以使用自定义指令来做到这一点，但在走这条路之前，我想确保没有开箱即用的方式。

我试过的

a）在淡入的元素上放置一个转换延迟：

b) 使用高度属性

这对我不起作用，因为我隐藏在我的应用程序中的 div 是网格系统的一部分。

笔记

如果我要在 jQuery 中实现它，它会是：

我创建了一个像这样补间的指令： app.directive('fadeInDown', function ($animate) {

我这样称呼它：

动画效果很好，但我想知道如何使用带有角度 1.2.13 的 $animate 来做到这一点？？？

我尝试了以下方法：

但是如何将参数传递回动画？？？？

该类被加载到另一个模块中，如下所示：

谁能解释一下如何做到这一点？？？

如果我的问题不清楚，请告诉我。

谢谢！！！