我试图了解如何使用 AngularJS UI Bootstrap 的分页返回到分页项目列表的正确页面。
我的项目已正确分页(12 页),并且分页过滤器有效(第 1 页 = 1-12、第 2 页 = 13-24 等)。我还为每个项目创建了一个到详细信息模板的路线,这也很有效。
在详细信息页面上,我有一个按钮可以返回到应用程序根目录(“/”)的模板,名为“返回目录”,这是项目列表的第 1 页。但是,即使是第 24 项的详细信息,此按钮也会返回第 1 页。我想做的是转到第 2 页,其中第 24 项是分页的,如果显示的详细信息适用于 25 之间的任何项目,则转到第 3 页-36,依此类推。
请告知如何去做这样的事情。
最佳答案
您可以使用 Pagination service
对于这种情况。
例如:
app.service('PaginationService', function(){
var service = {};
service.currentPageNumber = 1;
service.setNewPageNumber = function(newPageNumber) {
service.currentPageNumber = newPageNumber;
};
return service;
});
app.controller('CatalogController', function($scope, PaginationService){
$scope.currentPage = PaginationService.currentPageNumber;
$scope.totalItems = 0;
$scope.itemsPerPage = 10;
$scope.setPage = function (pageNo) {
$scope.currentPage = pageNo;
};
$scope.$watch('currentPage', function () {
PaginationService.setNewPageNumber($scope.currentPage);
});
});
每次更改当前页码时,
PaginationService.setNewPageNumber()
将被调用,并在从详细信息页面返回后, Controller 将重新加载 您将获得该服务的实际页码。$scope.currentPage = PaginationService.currentPageNumber;
希望能帮助到你!
关于angularjs - 使用 AngularJS UI Bootstrap 分页时返回正确的页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28314347/