如何滚动到AngularJS中的页面顶部？答案

【问题标题】：How to scroll to top of the page in AngularJS?如何滚动到AngularJS中的页面顶部？
【发布时间】：2015-05-06 10:38:41
【问题描述】：

我想在使用 angularjs 获得 ajax 调用响应后滚动到页面顶部。基本上，我在页面顶部显示警报消息，并且我希望将警报消息集中在收到的 ajax 响应中。

谢谢

【问题讨论】：

【解决方案1】：

你可以使用

$window.scrollTo(x, y);

其中x 是沿水平轴的像素，y 是沿垂直轴的像素。

关注元素

$window.scrollTo(0, angular.element('put here your element').offsetTop);

更新：

你也可以使用$anchorScroll

【讨论】：

关注元素，$window.scrollTo(0, angular.element('put here your element').offset().top);
别忘了在控制器函数定义中注入 $window。例如：函数 ($scope, $rootScope, $location, base_factory,$window)
@MuhammadReda 当你说把你的元素放在这里时'是元素的 id 吗？例如，我想滚动到 id 为“directions_panel”的元素的顶部，所以我输入了你说“把你的元素放在这里”的地方，但是我得到了一个错误。感谢您的帮助
@MuhammadReda 我现在可以使用了，谢谢。而不是 angular.element('put your element here').offsetTop 我做了 document.getElementById('my_element').offsetTop。感谢您的帮助:)
我不知道为什么，但这两个代码都不起作用。我将它与 ng-calendar 指令一起使用。 :(

【解决方案2】：

您可以使用$anchorScroll。

只需注入 $anchorScroll 作为依赖项，并在您想要滚动到顶部时调用 $anchorScroll()。

【讨论】：

【解决方案3】：

使用：$anchorScroll();

带有$anchorScroll 属性

【讨论】：

【解决方案4】：

理想情况下，我们应该根据适用的情况从控制器或指令中执行此操作。使用$anchorScroll、$location作为依赖注入。

然后调用这两个方法为

$location.hash('scrollToDivID');
$anchorScroll();

这里scrollToDivID是你要滚动的id。

假设你想导航到一个错误信息 div 为

<div id='scrollToDivID'>Your Error Message</div>

更多信息请看documentation

【讨论】：

【解决方案5】：

别忘了你也可以使用纯 JavaScript 来处理这种情况，使用：

window.scrollTo(x-coord, y-coord);

【讨论】：

【解决方案6】：

 $scope.$on('$stateChangeSuccess', function () {
    document.body.scrollTop = document.documentElement.scrollTop = 0;
 });

【讨论】：