微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

javascript – 如何在ui bootstrap分页中禁用下一个按钮?

我试图在我的页面中创建分页并使用分页控件.一切正常,但唯一的疑问是如何在这里手动禁用下一个按钮

<pagination   
    total-items="totalItems" 
    items-per-page= "itemsPerPage"
    ng-model="currentPage" 
    class="pagination-sm"  
    page="currentPage"
    max-size= "maxSize"
    ng-change="pageChanged(currentPage)">
</pagination>

在我的控制器中 –

$scope.currentPage=1;
$scope.itemsPerPage = 5;
$scope.maxSize = 2;
$scope.numberofrows =5;

 $scope.fetchResult =function(startingId){
                  if(startingId ==undefined){
                      $scope.StartingId = ''; 
                  }
                  else{
                      $scope.StartingId= startingId ; 
                  }
                  Api.customerReq.queryProductbyperiod({ productId : $scope.customerProduct,productperiod :$scope.customerPeriod,startingid: $scope.StartingId,numberofrows:$scope.numberofrows}).$promise.then(function(result) {
                        if(result){
                            if(result&&result.length==0){
                                // error alert 
                                }
                            $scope.customerResult = result;
                            if($scope.currentPage==1){
                             $scope.NextStartingId = result[5].id;
                             // on landing page storing last stringId for the next request to cassandra since row num requested as 6.
                            }
                            else{
                            $scope.NextStartingId = result[4].id;  // rest of the page,row num requested as 5.
                            }

                    $scope.prevIoUsstartingId=$scope.NextStartingId; 
                            if($scope.currentPage== 1){ 
                                $scope.totalItems= result.length;
                            }
$scope . pageChanged = function (page) {
    if (page > $scope . count)
    {
        $scope . count ++;
        //  temp = page;
        $scope . nextPage();
    } else
    {
        $scope . count = page;
        $scope . prevPage();
    }
};

              $scope.prevPage = function() {
                  if($scope.currentPage ==1){
                         $scope.prevIoUsstartingId = '';
                        }
                  $scope.fetchResult($scope.prevIoUsstartingId);
                  if($scope.currentpage>1)
                       $scope.totalItems -=5;

              };
             $scope.nextPage = function() {
                 if($scope.currentPage!=1){
                     $scope.numberofrows =5;

                 }                               
                 $scope.fetchResult($scope.NextStartingId);

                  $scope.totalItems +=5;     
                  };

这里在每个页面调用下一页上一页.我缺少什么或如何手动禁用nextlink?或者datepicker如何在这种情况下工作?

是的,每当我点击下一个或上一个按钮时我都会做api请求,因为cassandra对分页支持非常有限.所以每次查询存储的stringId来过滤结果,因为它们作为有序列表存储在Cassandra表中.所以它更像是服务器端分页在这里做的.

解决方法

如果没有要显示页面,UI boortstrap将自动禁用下一个链接.您无需使用ng-change来禁用分页项.如果你需要它们,我不应该为其他处理程序,例如确认或ajax请求.
您可以通过以下公式进行检查:

totalItems / temsPerPage - maxSize

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐