我看着你的朋克。问题在于您使用类为视图设置动画的方式。
当
$routeChangeSuccess事件触发时，
ngView在您有机会改变方向之前已经删除了该类。您可以通过如此快地应用新类来覆盖它，以至于不会引起注意，但是您会收到摘要进行中错误。
我的解决方案（插件）：
我想出了一个指令：
app.directive('animClass',function($route){ return { link: function(scope, elm, attrs){ var enterClass = $route.current.animate; elm.addClass(enterClass); scope.$on('$destroy',function(){ elm.removeClass(enterClass); elm.addClass($route.current.animate); }) } }});animate
为每个路线声明一个选项：
app.config(function($routeProvider) { $routeProvider. when("/page1", { templateUrl: "page1.html", controller: "Page1Ctrl", animate: "slideLeft" }). when("/page2", { templateUrl: "page2.html", controller: "Page2Ctrl", animate: "slideRight" }). otherwise({ redirectTo: "/page1" });});然后ngView
像这样添加它：
<div ng-view ng-controller="ViewCtrl" anim-class ></div>
CSS：
.view { width: 100%; padding-left: 1em; position:absolute; top: 0; left: 0;}.slideLeft.ng-enter, .slideLeft.ng-leave, .slideRight.ng-enter, .slideRight.ng-leave { -webkit-transition:all 1s; transition:all 1s;}.slideLeft.ng-enter { left:100%;}.slideLeft.ng-enter.ng-enter-active { left:0;}.slideLeft.ng-leave.ng-leave-active { left:-100%;}.slideRight.ng-enter { left:-100%;}.slideRight.ng-enter.ng-enter-active { left:0;}.slideRight.ng-leave.ng-leave-active { left:100%;}
