offset ui-路由器自动滚动

Question

当 loads/route 页面发生变化时，我正在使用 ui-router 的 autoScroll 向下滚动到 div（ui-视图）。目前是这样做的。有什么办法可以抵消autoScroll吗？我需要在菜单可见的元素上方保留 100px，并且对如何实现这一点感到困惑。

app.directive('scrollTop', function($uiViewScroll) {

        var linker = function (scope, element, attr, $elm) {
            $uiViewScroll(element);
        };

        return {
            restrict: 'A',
            link: linker
        }
   });

HTML:

<ui-view [autoscroll="true"]/>

Answer 1

autoscroll 指令允许您在填充视图时设置浏览器的滚动行为window。

默认情况下，$anchorScroll 被 ui-router 的自定义滚动服务 $uiViewScroll 覆盖。此自定义服务可让您在状态激活期间填充 ui-view 元素时将它们滚动到视图中。

尝试修饰默认的 $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...
    }; 
  });
});

见http://corpus.hubwiz.com/2/angularjs/22290570.html

offset ui-路由器自动滚动

offset ui-router autoScroll

angularjs

angular-ui-router

autoscroll