如果我在A页面把页面下拉了,再点击跳转到B页面,页面的位置不是现实的最顶端(而是A页面的页面位置)。
如何让页面每次跳转都把下一个页面的时候,都让页面显示在顶部:
使用 $anchorScroll
依赖:
```$window $location $rootScope $anchorScroll
PS:官方文档说明请参考:
https://docs.angularjs.org/api/ng/service/$anchorScroll
或参考简书上的相关文章:
http://www.jianshu.com/p/9cd7c2d2710f
以下是我参考相关资料后在项目中的解决方法:
index.html:
body部分:在ui-view 的div 中加入id"view-pos":
<body ng-controller="AppCtrl">
<div ng-include="'app/header.tpl.html'"></div>
<div ng-init="myInit()" id="view-pos" ui-view class="container-fluid"></div>
<div ng-include="'app/footer.tpl.html'"></div>
</body>
app.js:
angular.module('authorization').controller('AuthController', ['$location', '$window', '$rootScope','$anchorScroll',
function ( $location, $window, $rootScope,$anchorScroll) {
$anchorScroll.yOffset = 30; // 总是滚动额外的30像素(此处是因为我的项目中样式设置原因,需要加上以offset)
$location.hash('view-pos');
$anchorScroll();
}
]);
但测试发现设置了id之后跳转的页面url后面都会加上id "#view-pos",于是修改index.html中id值为空,同时app.js中$location.hash('view-pos')
中的id值也去掉(改为$location.hash('')
或者$location.hash()
),这样跳转的url上就不会带上id。
热门评论
太好了。我也发现了这个问题。感觉这个不合理啊,没道理默认保留上一个页面滚动的位置