用bootstrap开发一个angularjs应用程序,我在承诺后生成了一个web。然后,有一个带有链接项目的长列表组。此列表是用ng repeat生成的。
当我点击一个项目然后返回时,我失去了我在列表中的位置,它会将我发送到列表的顶部。
我怎样才能回到原来的位置?
这里有一些代码:
<div class="list-group">
<a id="{{pos.id}}" class="list-group-item" bindonce ng-repeat="pos in elements" ng-click="go('/otherPlace/{{pos.id}}')">
<h4 class="list-group-item-heading" bo-bind="pos.id"></h4>
<span class="list-group-item-text" bo-bind="pos.description"></span>
</a>
</div>
我在列表的每个元素中都有ID(位置ID),但我不知道如何将卷轴放在特定的ID中。如果我使用传统格式(URL#id)构建URL,则不会发生任何事情。
在目的地url有一个返回按钮。这是代码:
$scope.returnToMainPage(){
$window.history.back();
}
中也解决了类似的问题https://stackoverflow.com/a/29760881/4679838
基本上,如果你的web是在promise之后生成的,或者你的操作(滚动)依赖于DOM,那么你必须在一个有角度的摘要循环之后执行你的函数。
当你点击列表中的一个元素时,你必须存储scrollTop信息。为了做到这一点,请更改ng点击行为:
ng-click="saveScrollTopAndGoToURL ('/otherPlace/{{pos.id}}')"
这就是功能的实现:
$scope.saveScrollTopAndGoToURL = function (destinationUrl)
{
$rootScope.scrollTop = document.body.scrollTop;
$location.path(destinationUrl);
}
然后,当你从目的地URL返回时,你必须恢复它
$scope.returnAndRestoreScrollTop = function() {
$window.history.back();
$timeout(function() {
document.body.scrollTop = $rootScope.scrollTop;
}, 500, false); // There is a 500 ms delay before executing the function.
};