1. 首页
  2. 问题
  3. 角度ui路由器滚动到顶部，而不是ui-view
一尘不染

角度ui路由器滚动到顶部，而不是ui-view

angularjs

我刚刚升级到ui-router 0.2.8从0.2.0和我已经注意到，状态改变时，滚动位置跳到德子的顶部ui-view是新状态的主题。

很好，但是我有两个问题：

1）我在页面顶部和之间填充了30px的空白ui-view，我希望它滚动到页面顶部，并留出一定的空隙。目前，它正好到达ui- view看起来难看的顶部。为此，我想我要么需要知道如何使其滚动到ui视图所在的div的顶部（而不是浏览器viewport），要么我需要找出如何重写$uiViewScroll才能滚动到ui- view负30px 。

我已经尝试过，$uiViewScrollProvider.useAnchorScroll();但是如果这样做，它根本不会滚动。我也尝试过<ui- view autoscroll="false">;，它也完全停止了滚动。

2）它目前实际上并没有滚动，只是跳了起来。是否应该滚动或由开发人员通过CSS转换来做到这一点？

任何帮助将不胜感激:)


阅读 224

收藏
2020-07-04

共1个答案

一尘不染

另一种方法是装饰默认$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"。我没有仔细研究实际的滚动实现，只是想知道我提到了装饰器方法（这很有趣）作为替代方法。我相信您可以算出确切的滚动行为。

2020-07-04