javascript - ng-使用 limitTo 过滤器重复第一页和最后一页

Question

这里使用 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 是我的自定义过滤器(因为 limit to 在 Angular 1.3.4 中不可用)

CTApp.filter('dataLimitTo', function () {
    return function (input, limit, begin) {
        return input.slice(begin, begin + limit);
    };
});

在我的 Controller 中:

$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 个按钮。如果他们按首页按钮，他们将返回并看到第一页行，如果他们单击最后一页按钮，他们将看到行页。

这可以用我上面的代码实现吗？我需要做出哪些改变。

抱歉，目前我不寻找任何其他第三方解决方案。

Answer 1

要移至第一页，请将开始设置为零，即 $scope.start=0

I was able to do the last page as:

$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);
}