ngx-pagination
ngx-pagination copied to clipboard
InvalidPipeArgument Error in pagination-controls
Angular version: 12.0.4
ngx-pagination version: 5.1.1
Description of issue: I'm getting this error when pagination-controls component is initializing:
InvalidPipeArgument: 'Cannot read properties of undefined (reading '0')' for pipe 'DecimalPipe' at invalidPipeArgumentError (common.js:4128:1) at DecimalPipe.transform (common.js:4881:1) at pureFunction2Internal (core.js:25681:1) at Module.ɵɵpipeBind2 (core.js:25855:1) at PaginationControlsComponent_ul_2_li_4_ng_container_2_Template (ngx-pagination.js:88:92) at executeTemplate (core.js:9618:1) at refreshView (core.js:9484:1) at refreshEmbeddedViews (core.js:10609:1) at refreshView (core.js:9508:1) at refreshEmbeddedViews (core.js:10609:1)
My model for pagination and displaying items has those values: model: { currentPage: 1 entryCount: 20 items: (3) [{…}, {…}, {…}] pageWidth: 20 startEntry: 1 totalEntries: 3 totalPages: 1 }
Steps to reproduce: There is no any extra steps. I'm using pagination in simple way as suggested in docs.
Expected result: Pagination controls are showing with current page number. In my case I have one page which is current.
Actual result: Number of page doesn't show. Other eleements are showing and styling is working.
I'm importing NgxPaginationModule in my module.ts as provided in docs. That's how i use it:
<tr *ngFor="let item of model.items | paginate: {itemsPerPage: model.entryCount, currentPage: model.currentPage}"></tr>
</tbody>
</table>
</div>
<div *ngIf="model.items.length > 0">
<pagination-controls
(pageChange)="changePage($event)"
[previousLabel]='"<"'
[nextLabel]='">"'>
</pagination-controls>
<ng-select
[ngModel]="model.entryCount"
(ngModelChange)="changeEntriesCount($event)"
[clearable]="false"
[searchable]="false"
[multiple]="false">
<ng-option *ngFor="let size of pageSizes" [value]="size">{{size}}</ng-option>
</ng-select>
</div>