使用角度ui-router和ng-animate自动滚动到目标视图的滑动视图

Question

我正在使用AngularJS的ui-router和ngAnimate来创建移动设备中的经典滑动视图。

我发现在页面上存在两个视图的过渡开始时，如果目标视图不在视口中，它将首先跳转到该视图位置，这给我们带来了这样有趣的效果：< / p>

plunker

无论如何都要避免这种情况吗？

Answer 1

Angular UI-Router最近更新了它的应用程序，以便它自动向下滚动到默认加载的新视图。这导致我的应用程序页面向下滚动。要关闭此功能，只需将以下属性添加到您的ui-view：

<div ui-view="header"  autoscroll="false"></div>

Answer 2

嗯，通常Angular使用$ anchorscroll滚动到一个新视图。可以通过调用模块上的.value('$anchorScroll', angular.noop)来禁用它，如下所示：

var app = angular.module('app', [
        'ui.router',
        'ngAnimate'
    ]).value('$anchorScroll', angular.noop);

但是，UI-Router使用自己的。我通过告知UI-Router使用（现已禁用）$anchorScroll：$uiViewScrollProvider.useAnchorScroll();

来禁用它

Here is the updated plunker