更改路线时,将ng-view top position重置为0

时间:2015-08-04 16:30:22

标签: javascript css angularjs

我做了一个转换页面,当路由更改动画时工作不正常。

动画类型从下到上,您可以在第一个加载页面中看到。

我该如何解决?

演示: http://plnkr.co/edit/j7r3s33Y3GcTyH2Fop9K?p=preview

app.config(function($routeProvider, $locationProvider) {

$routeProvider.
    when("/first-page", {
      templateUrl: "first-page.html",
      animate: "slideup"
    }).
    when("/second-page", {
      templateUrl: "second-page.html",
      animate: "slideup"
    }).
    otherwise({
      redirectTo: "/first-page"
    });

});


// PAGE ANIMATE DIRECTIVE
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)
      })
     }
  }
});

0 个答案:

没有答案