限制显示页面时的分页问题

我正在处理一大堆我想分页的数据。分页正在工作，但我已经被要求限制在跳转向前和向后按钮中显示和添加多少页面。我只想一次显示5页，并将页面计数器调整为仅显示2个高页面和2个低页面。例如，如果我在第4页上，我只希望传呼机显示2,3,4,5,6。所以这里是我的问题gif。限制显示页面时的分页问题

See how the pager shows the page out of range for a second before it disappears?

下面是创建分页的代码。

var pagenate = function (page, totalPages) { 
     maxShownPage = page + 2; 
     minShownPage = page - 2; 
     pageCount = []; 

     if (minShownPage <= 1 && maxShownPage <= totalPages) { 
      minShownPage = 1; 
      maxShownPage = 5; 
     } 
     if (maxShownPage > totalPages) { 
      maxShownPage = totalPages; 
      minShownPage = totalPages - 4; 
     } 

     for (i = minShownPage; i <= maxShownPage; i++) { 
      pageCount.push(i); 
     } 

    };

然后在AngularJS方法中，我调用这样的分页方法。

   howManyPages = Math.ceil(visits.SurveyCount/pageSize); 
       pagenate(page, howManyPages); 
       $scope.pages = pageCount;

如果你可以请帮助我阻止分页显示消失的页面。

谢谢。

来源

2017-04-25 Justin Wine

你使用角动画？ –

我正在使用角动画。 –

我认为你的问题正在发生，因为你正在使用角动画。 .ng-enter, .ng-enter-active, .ng-leave, .ng-leave-active类正在导致淡出发生，所以这表明数字在它被转出之前。我建议你创建一些专门用于这些类的CSS来覆盖原有的功能。

很难确切地告诉你在不看到CSS的情况下你应该做什么，但是我会确保在这些转换过程中没有任何事情发生。这意味着你可以覆盖当前在这些类中的任何东西（不透明度，动画持续时间等），它的版本不做任何事情。

来源

2017-04-25 21:27:48

原来是角度动画类的CSS问题。我只是设置.ng-enter和.ng-leave来显示：none;并解决了这个问题。 –

@JustinWine很好听。所以我想我的答案是正确的。 –

@JustineWine如果您同意，您可以将我的答案标记为已接受的答案。 –

限制显示页面时的分页问题

回答

相关问题