从Angular 1.2更新后我的动画有问题 – > 1.4.
我通过更改视图容器元素上的css类来设置页面过渡动画.
我使用ui-router并在元素上使用ng-class指令.
用户使用箭头键(app.run()中的事件侦听器)进行导航.这将类设置为$rootScope上的字符串变量’navDirection'(左/右).
更新后,似乎在动画之后设置了$rootScope.navDirection.因此,当用户改变方向时动画是错误的.
任何建议和/或评论表示赞赏!
的index.html
<body ng-cloak ng-keydown="handleEvt($event)"> <div class="page-wrapper page-wrapper--constrain" ng-class="{'page-wrapper--decorate' : decoratePageContent === true}"> <div class="page-content group position-context"> <div ui-view class="slide" ng-class="{'at-view-slide-in-left at-view-slide-out-right': navDirection == 'right','at-view-slide-in-right at-view-slide-out-left': navDirection == 'left'}"></div> </div> </div> </body>
app.js
var app = angular.module('my-app',[ 'ui.router','ngAnimate' ]); // ... app.run(function ($rootScope,navigationService) { $rootScope.handleEvt = function(e) { if ($rootScope.navVisible) { switch (e.which) { // right case 37: $rootScope.navDirection = "right"; navigationService.navigate(navigationService.getCurrentPageIndex() - 1); break; // left case 39: $rootScope.navDirection = "left"; navigationService.navigate(navigationService.getCurrentPageIndex() + 1); break; } } }; // ...