在此处使用angularjs 1.3:
我在表格行中使用限制为,例如以下示例:
<tr ng-repeat="r in table.rows | dataLimitTo:limit:start">
<td>{{r.id}}</td>
<td>{{r.name}}</td>
</tr>
<div class="form-group" ng-if="table.rows.length>100">
<button class="btn btn-primary" type="button" ng-click="prev()">Prev</button>
<button class="btn btn-primary " type="button" ng-click="next()">Next</button>
</div>
我有很多数据,因此每页限制为100。在上一个和下一个按钮上方,单击以帮助我浏览黑白页面。
在dataLimitTo上方也是我的自定义过滤器(由于角度1.3.4中不提供对的限制)
CTApp.filter('dataLimitTo', function () {
return function (input, limit, begin) {
return input.slice(begin, begin + limit);
};
});
在我的控制器中:
$scope.start = 0;
$scope.limit = 100;
$scope.next = function () {
incrementLimit(true)
}
$scope.prev = function () {
incrementLimit(false)
}
function incrementLimit(up) {
if (up) {
($scope.start <= ($scope.table.rows.length - $scope.limit)) ? $scope.start += 100 : $scope.start = 0;
} else {
$scope.start > 100 ? $scope.start -= 100 : $scope.start = 0;
}
}
以上代码工作正常,我可以使用上一个和下一个按钮移动黑白页面。
我还希望在首页和末页都有2个按钮。如果他们按下首页按钮,他们将返回并看到行的第一页;如果他们单击最后一页按钮,则将看到行的页。
这与上面的代码兼容吗?我需要进行哪些更改。
很抱歉,目前我不在寻找任何其他第三方解决方案。
答案 0 :(得分:1)
要移至第一页集,请从零开始,即$scope.start=0
我能够按以下方式完成最后一页:
$scope.start = Math.floor($scope.table.rows.length / $scope.limit) * 100;
应该是:
$scope.start = Math.floor($scope.table.rows.length / $scope.limit) * $scope.limit;
或者:
$scope.start = lastPageStart($scope.table.rows.length, $scope.limit)
function lastPageStart (len, limit) {
return len - (len % limit);
}