gpt4 book ai didi

angularjs - 根据过滤后的数据更新分页

转载 作者:行者123 更新时间:2023-12-02 22:20:22 25 4
gpt4 key购买 nike

如何根据 Angularjs 中过滤后的数据更新分页。

html 代码。

 <input type="text" class="form-control" ng-model="search" placeholder="Search">


<tr ng-repeat="application in applications=application | filter:search | startFrom:(currentPage-1)*itemsPerPage |limitTo:itemsPerPage">

Controller .js

$scope.$watch('search',function (term) {

$scope.applications = $filter('startFrom')($scope.application,term);
//
$scope.size = $scope.applications.length;
$scope.noOfPages = Math.ceil($scope.size / $scope.itemsPerPage);
$scope.currentPage = 1;


}, true);

过滤。

module.filter('startFrom', function () {
return function (input, start) {
if (input) {
start = +start;
return input.slice(start);
}
return [];
};
});

最佳答案

搜索功能:

  $scope.search = function () {
$scope.filteredList =
filteredListService.searched($scope.allItems, $scope.searchText);

if ($scope.searchText == '') {
$scope.filteredList = $scope.allItems;
}
$scope.pagination();
}

根据搜索结果计算总页数

 $scope.pagination = function () {
$scope.ItemsByPage = filteredListService.paged( $scope.filteredList, $scope.pageSize );
};

$scope.setPage = function () {
$scope.currentPage = this.n;
};

$scope.firstPage = function () {
$scope.currentPage = 0;
};

$scope.lastPage = function () {
$scope.currentPage = $scope.ItemsByPage.length - 1;
};

这里是JSFiddle带过滤器的分页示例,以便您可以使用它并根据您的要求进行修改。

关于angularjs - 根据过滤后的数据更新分页,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34327962/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com