如何在AngularJs中的无限滚动中实现后退按钮？

Question

我正在构建一个带有angularjs的应用程序，我已经实现了无限滚动技术，因为我有很多要展示的项目，所以这是一个比分页更好的体验，但是如果用户点击项目那么我有它的坏处是它会转到项目页面，但是当他想要回去时，他会在顶部，他应该继续滚动。 这就是我想要完成的，如果他按下按钮他可以回到他所在的位置！

上市物品：

<div class="container" id="infinit-container" ng-controller="ArticlesController">

    <div id="fixed" when-scrolled="LoadMore()">
        <div ng-repeat="article in Articles">
            <article-post article="article"></article-post>
        </div>
    </div>
</div>

这是when-scrolled指令

app.directive('whenScrolled', function () {
return function (scope, element, attrs) {
    $('#fixed').height($(window).height());
        var div = element[0];
        element.bind('scroll', function () {
            if (div.scrollTop + div.offsetHeight >= div.scrollHeight) {
                scope.$apply(attrs.whenScrolled);

            }
        })
    }
})

那就是控制器

app.controller('ArticlesController', function ($scope, UserService) {
  $scope.Articles = [];

  var page = 0;
  $scope.LoadMore = function () {
    UserService.Articles(page)
      .success(function (data) {
        $scope.Articles.push.apply($scope.Articles, data);
      });
    page++;

  };
  $scope.LoadMore();
});

Answer 1

即时通讯使用页码，在某个地方保存页码（我更喜欢sessionStorage），当用户返回列表，阅读页码并加载页面时，查看项目详细信息。

它是主页面控制器的简单代码（列表）

app.controller('ArticlesController', function($scope, UserService) {
    $scope.Articles = [];

    var page = 0;
    $scope.LoadMore = function() {
        UserService.Articles(page)
            .success(function(data) {
                $scope.Articles.push.apply($scope.Articles, data);
            });
        page++;

    }

    $scope.LoadArticle = function(articleId) {
        sessionStorage.setItem("pageNumber", page);

        /// change path to somewhere you want show your article
    };


    //it will load the page you coming back from
    if (sessionStorage["pageNumber"]) {
        page = parseInt(sessionStorage["pageNumber"]);
    }
    LoadMore();
});

因为使用sessionStorage，如果用户按预期关闭浏览器或页面，它将被删除。