When switching data sources dir-pagination-controls displays wrong number of results

[ot-brian-mackey]

The code below displays 37 pages when vm.totalResults is zero. The issue only happens in one scenario:

1. Display a user with 37 results
2. Hide that user data with ng-if go to another user with 0 results
3. User displays 37 results.
4. Refresh the page (F5 in browser) and now the pagination control goes away as it should as there are 0 results.

Why is this happening?

 <md-list-item dir-paginate="alert in vm.allAlerts | itemsPerPage: vm.pageSize" total-items="vm.totalResults" current-page="vm.currentPage" pagination-id="customerAlerts">

//More code...

  <dir-pagination-controls on-page-change="vm.alertsReload(newPageNumber)" layout="row" layout-align="center center" pagination-id="customerAlerts"></dir-pagination-controls>

[ot-brian-mackey]

This is happening because paginationService.instances[instanceId].collectionLength returns '37' as can be seen by the return value of paginationService.getCollectionLength(instanceId). collectionLength should have been reset to 0.

I think $watch should be updating the now empty collection and it is not:

if (typeof attrs.totalItems !== 'undefined') {
                    paginationService.setAsyncModeTrue(paginationId);
                    scope.$watch(function() {
                        return $parse(attrs.totalItems)(scope);
                    }, function (result) {
                        if (0 <= result) {
                            paginationService.setCollectionLength(paginationId, result);//not called
                        }
                    });
                } 

[ot-brian-mackey]

As a workaround I hide the pagination control when there are 0/null results with ng-if.

<dir-pagination-controls ng-if="vm.totalResults" on-page-change="vm.alertsReload(newPageNumber)" layout="row" layout-align="center center" pagination-id="customerAlerts"></dir-pagination-controls>

[ot-brian-mackey]

After more research I see that dirPaginateDirective does not fire when I show/hide my data by toggling ng-if=. The app.Controller reloads, creating new state, but the said directive does not recompile and capture the new state when there is no data to display.

[michaelbromley]

Hi,

Thanks for the detailed report. Is it possible to make a Plunker demo of this?

I cannot tell from what you wrote, but are there multiple dir-paginations being used in the same view? If so, are the pagination-ids resolving to unique values?

[ot-brian-mackey]

I will work on a plunker reproduction of the issue. This page only has 1 dir-pagination, however there are at least 2 others used in the site. I see three active, uniquely named paginationid's in the paginationService.instances. One uses the __default name, however the one I am experiencing a problem with uses the name customerAlerts unique to this pagination controller.