javascript – Angular ui-router滚动到顶部,而不是ui-view

我刚刚从0.2.0升级到ui路由器0.2.8,我注意到,当状态改变,滚动位置跳转到te子ui-view的顶部,这是新的状态的主题。

这是很好,但我有两个问题:

1)我在页面的顶部和ui视图之间有30px padding,我想它滚动到页面的顶部,留下一个空白。在这一刻,它正好到看起来丑陋的ui视图的顶部。为了实现这一点我想我需要知道如何得到它滚动到的顶部的ui-view(不是浏览器视口),或者我需要找到如何覆盖$ uiViewScroll滚动到ui视图减去30px。

我试过$ uiViewScrollProvider.useAnchorScroll();但如果我这样做,它不滚动。我也试过< ui-view autoscroll =“false”&gt ;;,这也完全停止滚动。 2)它实际上不滚动,只是跳转。是假设滚动还是由开发人员这样做与CSS转换? 任何帮助真的会赞赏:)

另一种方法是装饰默认的$ uiViewScroll服务,有效地覆盖默认行为。

app.config(function ($provide) {
  $provide.decorator('$uiViewScroll', function ($delegate) {
    return function (uiViewElement) {
      // var top = uiViewElement.getBoundingClientRect().top;
      // window.scrollTo(0, (top - 30));
      // Or some other custom behaviour...
    }; 
  });
});

正如Hubrus所说的,对于任何< ui-view>你不希望这个申请,只需添加autoscroll =“false”。我没有仔细考虑实际的滚动实现,我只是想我会提到装饰器的方式(它有很多的乐趣)作为替代。我相信你可以制定出确切的滚动行为。

http://stackoverflow.com/questions/22290570/angular-ui-router-scroll-to-top-not-to-ui-view

本站文章除注明转载外,均为本站原创或编译
转载请明显位置注明出处:javascript – Angular ui-router滚动到顶部,而不是ui-view