ng动画动画方向

我想获得一些简单的ng动画行为工作，但已经打到了墙上，并不能完全弄清楚我做错了什么。ng动画动画方向

我的代码包含一个用于指示UI视图应该从哪里来的方向的类 - 一个用于显示屏幕左侧或右侧的类的angularui ui-view，用于显示滑动面板的显示，或隐藏数据。

你可以在这里看到我 - 注意链接箭头的方向;

http://plnkr.co/edit/H2eRr5pPNKTDHXFXsyUn

所述UI视图码是：

<div ui-view class="{{whichWayToMove}}"></div>

与一对夫妇routeChange事件侦听器来检测时，相应的CSS应该改变的其中UI意见来自的方向。

我有一个感觉问题是一个范围的问题，但会感谢一些外界的帮助。

来源

2014-04-28 GrahamB

我也有一个问题，有时滑错了ui-view。我的问题是，该类是ui视图的一部分，但ui视图被重复以便能够滑动一个视图和一个视图。在此重复期间，一个视图获得了旧类，另一个视图获得了该视图像这样的新更新类：

<div ui-view="" class="slide_from_left_to_right ng-animate ng-enter ng-enter-active"> 
</div> 
<div ui-view="" class="slide_from_right_to_left ng-animate ng-leave ng-leave-active"> 
</div>

这弄乱了动画。将class="{{whichWayToMove}}"置于父项div可以防止这种情况发生，并使您的CSS更符合逻辑。 .slide_from_right_to_left将成为RTL情况的父类，在这种情况下，两个视图的所有动画都存在。你可以在plnkr看到我的意思。

来源

2014-07-03 13:41:25 bas

将方向类应用到'ui-view'的父容器中正是我一直在寻找！非常感谢！ – timetowonder

您的问题是，每次切换选项卡时，它会为该选项卡创建一个新的控制器，以便您不断注册$ stateChangeStart的新侦听器而不注销旧的。这意味着当一个新的监听器被注册时（改变whichWayToRemove属性）它最终会被注册的第一个处理器覆盖。

看看登录到plnkr的控制台，看看我的意思。

可以找到一个工作版本here，它监听$ scope上的事件而不是$ rootScope，这样，当控制器被删除时，$ scope将与它一起被删除，因此不再监听$ stateChangeStart事件

更新

为了让动画中，你只需要改变哪些类被置当一个箭头的方向发生。这已在plnkr here中更新。我还删除了监听事件，因为在创建控制器时whichWayToMove属性将刚刚设置。

来源

2014-04-28 16:55:56 Theo

谢谢你。它还没有工作 - 当标签2进入视图时它正常工作，但是当点击标签2上的链接时，它不会沿箭头方向移动。我一直在努力工作的是让两个标签都朝相同的方向移动，1或2移动到左侧，或1和2移动到右侧。 – GrahamB

我已经更新了我的答案，包括如何获得箭头后面的动画。当你说你想让两个标签都朝着同一个方向思考时，我不确定你在找什么。这是否意味着你不想让他们跟随箭头？无论如何，你应该能够完成你现在需要的东西 – Theo

使用'ng-class'而不是'class' – zainengineer

ng动画动画方向

回答

相关问题