search

Ants24 / angular2-datatable-pagination

MIT License
6 stars 7 forks source link

NG2DataTable.getPage #1

Open MichaelChambers opened 7 years ago

MichaelChambers commented 7 years ago

I found that the NG2BootstrapPaginator was not displaying the paging buttons on the left on my initial component load, but only after paging changes.

I traced it to NG2DataTable getPage and fixed it by: dataLength: this.isServerPaginationage ? this.amountOfRows : this.inputData.length

I think the reason is that this particular data has already been cached in localStorage and so it returns immediately, setting NG2DataTable.amountOfRows before the call to NG2DataTable.getPage.

Adding logging, this is the output without the change, where my Summaries component sets amountOfRows to 16, but NG2DataTable.getPage still returns 10.

Summaries.constructor NG2DataTable.constructor NG2DataTable.amountOfRows setter 0 NG2DefaultSorter.constructor ... NG2BootstrapPaginator.constructor NG2Paginator.constructor NG2Paginator.dataLength setter 0 Summaries.substances setter Summaries.setData this.sorted.length=16 this.activePage=1 this.rowsOnPage=10 start=0 end=10 NG2DataTable.amountOfRows setter 16 NG2DataTable.onChanges Object {inputData: SimpleChange, sortBy: SimpleChange, sortOrder: SimpleChange, rowsOnPage: SimpleChange, activePage: SimpleChange…} NG2DataTable.recalculatePage NG2DataTable.amountOfRows getter 16 NG2DataTable.amountOfRows getter 16 NG2DataTable.doCheck DefaultIterableDiffer {_length: 10, _collection: Array[10], _linkedRecords: _DuplicateMap, _unlinkedRecords: null, _previousItHead: null…} NG2DataTable.recalculatePage NG2DataTable.amountOfRows getter 16 NG2DataTable.amountOfRows getter 16 NG2DataTable.fillData NG2DefaultSorter.onInit ... NG2BootstrapPaginator.onChanges Object {rowsOnPageSet: SimpleChange} NG2Paginator.onChanges Object {inputMfTable: SimpleChange} NG2DataTable.getPage Object {activePage: 1, rowsOnPage: 10, dataLength: 10} NG2Paginator.onPageChangeSubscriber Object {activePage: 1, rowsOnPage: 10, dataLength: 10} NG2Paginator.dataLength setter 10 NG2Paginator.dataLength getter 10 NG2Paginator.dataLength getter 10 NG2BootstrapPaginator.isDataLengthMoreThanRowsOnPage false NG2Paginator {injectMfTable: NG2DataTable, _dataLength: 10, inputMfTable: undefined, mfTable: NG2DataTable, activePage: 1…} NG2Paginator.dataLength getter 10

Whereas this is the final output with the change, where the dataLength becomes 16

NG2DataTable.fillData NG2DefaultSorter.onInit ... NG2BootstrapPaginator.onChanges Object {rowsOnPageSet: SimpleChange} NG2Paginator.onChanges Object {inputMfTable: SimpleChange} NG2DataTable.amountOfRows 16 NG2DataTable.getPage Object {activePage: 1, rowsOnPage: 10, dataLength: 16} NG2Paginator.onPageChangeSubscriber Object {activePage: 1, rowsOnPage: 10, dataLength: 16} NG2Paginator.dataLength setter 16 NG2Paginator.dataLength 16 NG2Paginator.dataLength 16 NG2BootstrapPaginator.isDataLengthMoreThanRowsOnPage true NG2Paginator {injectMfTable: NG2DataTable, _dataLength: 16, inputMfTable: undefined, mfTable: NG2DataTable, activePage: 1…} NG2Paginator.dataLength 16

MichaelChambers commented 7 years ago

I also found that when in non server mode, I had to make a similar change to modify NG2DataTable's recalculatePage to have:

let lastPage = Math.ceil((this.isServerPaginationage ? this.amountOfRows : this.inputData.length) / this.rowsOnPage);