ui-bootstrap 分页在初始化时重置当前页面 [英] ui-bootstrap pagination resetting current page on initialization

问题描述

我正在使用 ui-bootstrap (angular-bootstrap) 库中的分页指令.我在初始化时遇到问题.当我通过 url 导航到特定页面时会出现我的问题.

I am using the pagination directive from the ui-bootstrap (angular-bootstrap) library. I am having an issue when it initializes. My issue occurs when I navigate to a specific page via url.

发生的事情是我的控制器使用 $stateParams 中的正确页面进行初始化，然后分页指令初始化并触发将页面重置为 1 的 ng-change 函数.现在不再使用 on-select-page，有没有办法只捕获用户点击来更改页面?理想情况下，我希望指令在控制器之前初始化，以便我的页面不会被重置.提前致谢.

What is happening is that my controller initializes with the correct page from $stateParams, then the pagination directive initializes and triggers the ng-change function which is resetting the page to 1. Now that on-select-page is no longer used, is there a way to only capture user clicks to change the page? Ideally I would like the directive to initialize before the controller so that my page does not get reset. Thank you in advance.

如果需要，我可以包含代码，但我觉得我的问题不一定需要代码块.

I can include code if needed, but I feel my question does not necessarily require a code block.

推荐答案

所以我在深入研究 angular-bootstrap 代码后找到了一个解决方案.他们的代码在 totalPages 上有一个监视，用于检查当前页面是否大于 totalPages 值.

So I found a solution after drilling down into the angular-bootstrap code. Their code has a watch on totalPages that checks if the current page is greater than the totalPages value.

角度引导代码:

if ( $scope.page > value ) {
  $scope.selectPage(value);
} else {
  ngModelCtrl.$render();
}

发生的事情是，如果我刷新第 3 页上的页面(例如)，我的控制器正在重新加载该页面的项目，导致 total-items 为 0，totalPages 计算为 1.这触发了手表和上面的代码.

What was happening was if I refreshed the page on page 3 (for example) my controller was reloading the items for that page temporarily causing total-items to be 0 and totalPages to be calculated as 1. This triggered the watch and the above code.

我的解决方案是在状态解析中加载项目，以便 total-items(以及 totalPages)始终准确.

My solution was to load the items in the state resolve so that total-items (and in turn totalPages) would always be accurate.

这篇关于ui-bootstrap 分页在初始化时重置当前页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！