使用ui-router和Angularjs自动滚动到TOP
我已经阅读了许多不同的问题，并没有提供任何解决scheme似乎符合我的使用情况。 我只是简单地把所有的链接都放在target =“_ top”，但是实际上这强制我的应用重新加载哪个不能工作。 我也看到有人说他们使用autoscroll =“true”，但只有在我的ui视图中才有效 。
这个问题是，在我的index.html文件中，我已经修复了导航和其他静态元素，高于我的第一个UI视图。 这意味着当我转到其他页面时，当页面加载经过这些元素时，我将失去导航。 我也试过把这个放在身体上：
<body autoscroll="true"> </body> 这似乎也没有做任何事情。 所以问题是，我怎样才能确保新的页面（从路由器的新路线更改）导致页面的顶部开始？ 谢谢！
如果您希望它始终滚动到0跨浏览器，则不执行自动滚动。 只要放置你的跑步块：
$rootScope.$on('$stateChangeSuccess', function() { document.body.scrollTop = document.documentElement.scrollTop = 0; });
我有完全相同的问题，固定在路由更改导航栏，页面加载部分向下滚动页面。
我刚添加autoscroll="false"到ui-view ，如下所示：
<div ui-view="main" autoscroll="false"></div>
编辑
刚刚testing过这种方法，一点肮脏的黑客，但它的作品。 将angular度服务$anchorScroll ＆ $location导入到ui-router .state config的相关控制器中。 然后在ui-router $stateParams上使用$watch来调用$location.hash('top'); 在路线/状态变化。
https://docs.angularjs.org/api/ng/service/ $ anchorScroll
https://docs.angularjs.org/api/ng/service/ $ location＃hash
.controller('myCtrl', function ($location, $anchorScroll, $scope, $stateParams) { $scope.$watchCollection('$stateParams', function() { $location.hash('top'); $anchorScroll(); }); });
我正在使用ui路由器。 我的跑步看起来像这样：
.run(function($rootScope, $state, $stateParams){ $rootScope.$state = $state; $rootScope.$stateParams = $stateParams; $rootScope.$on('$stateChangeSuccess', function() { document.body.scrollTop = document.documentElement.scrollTop = 0; }); })
有一个这样的Angular服务。 https://docs.angularjs.org/api/ng/service/$anchorScroll
示例代码：
.run(function ($rootScope, $state, $stateParams, $anchorScroll) { $rootScope.$on('$stateChangeStart', function () { $anchorScroll(); }); });
如果你想滚动到一个特定的元素
.run(function ($rootScope, $state, $stateParams, $anchorScroll) { $rootScope.$on('$stateChangeStart', function () { // set the location.hash to the id of // the element you wish to scroll to. $location.hash('bottom'); // call $anchorScroll() $anchorScroll(); }); });
我不得不做另外两个答案的组合。
<div ui-view autoscroll="false"></div>
与…结合
$rootScope.$on('$stateChangeSuccess', function() { document.body.scrollTop = 0; document.documentElement.scrollTop = 0; });
注意：这是在ui-router的v0.2.15上
和@TaylorMac的例外答案一样，但在$ locationChangeStart中。
index.run.js：
$rootScope.$on('$locationChangeStart', function() { document.body.scrollTop = document.documentElement.scrollTop = 0; });
