Question

我希望在路线更改时为我的包装器添加一个特定的类，以便我可以控制将触发的CSS动画。

我尝试这样做： http://plnkr.co/edit/KRwBFb6bCTkit9eKg8yb?p=preview

$rootScope.$on( "$routeChangeSuccess", function(event, next, current) {
   //Code to skip animation on the first load/page
    if( 'undefined' === typeof current || $scope.pageClass == '' ) return false;


    var elem = document.querySelector("#wrapper");
    var viewElem = angular.element(elem);

    $animate.addClass(viewElem, $scope.pageClass).then(function(){
        $animate.removeClass(viewElem, $scope.pageClass);
    });
});

但是没有添加任何课程，我是否以错误的方式使用此功能？

Answer 1

您的代码正在做的是将正确的CSS类添加到#wrapper元素，然后在添加后立即将其删除。 {[1}}函数（用于删除类）返回的promise将在添加类时解析，而不是在类完成的动画完成时解析。

如果您要做的是在动画完成后从addClass删除CSS类，以便您可以重置它以进行下一个动画，您需要将代码绑定到#wrapper事件而不是。如下所示：

enter

Angular.js页面过渡＆amp; $ animate.addClass

1 个答案: