Topic: MdbTablePagination lastPage event issue
nevena free asked 5 years ago
Click on the last page button on mdbTablePagination is not working when the page size is 5 and the list contains 6 elements - it doesn't change the mdbTablePagination.firstItemIndex and mdbTablePagination.lastItemIndex and doesn't move to the last page of the list.
Example code:
.html
{{head}} = mdbTablePagination.firstItemIndex && i {{el.id}} = mdbTablePagination.firstItemIndex && i {{el.first}} = mdbTablePagination.firstItemIndex && i {{el.last}} = mdbTablePagination.firstItemIndex && i {{el.handle}}
.tsimport { MdbTablePaginationComponent, MdbTableDirective } from 'PATH-TO-MDB-ANGULAR-HERE';
import { Component, OnInit, ViewChild, HostListener, AfterViewInit, ChangeDetectorRef } from '@angular/core';
@Component({ selector: 'table-pagination', templateUrl: './table-pagination.component.html', styleUrls: ['./table-pagination.component.scss']})export class TablePaginationComponent implements OnInit, AfterViewInit { @ViewChild(MdbTablePaginationComponent, { static: true }) mdbTablePagination: MdbTablePaginationComponent; @ViewChild(MdbTableDirective, { static: true }) mdbTable: MdbTableDirective elements: any = []; previous: any = []; headElements = ['ID', 'First', 'Last', 'Handle'];
constructor(private cdRef: ChangeDetectorRef) { }
ngOnInit() { for (let i = 1; i <= 6; i++) { this.elements.push({id: i.toString(), first: 'User ' + i, last: 'Name ' + i, handle: 'Handle ' + i}); }
this.mdbTable.setDataSource(this.elements);
this.elements = this.mdbTable.getDataSource();
this.previous = this.mdbTable.getDataSource();
}
ngAfterViewInit() { this.mdbTablePagination.setMaxVisibleItemsNumberTo(5);
this.mdbTablePagination.calculateFirstItemIndex();
this.mdbTablePagination.calculateLastItemIndex();
this.cdRef.detectChanges();
}}
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Opened
- ForumUser: Free
- Premium support: No
- Technology: MDB Angular
- MDB Version: 8.3.0
- Device: Desktop
- Browser: Google Chrome
- OS: Win10
- Provided sample code: No
- Provided link: No
Arkadiusz Idzikowski staff commented 5 years ago
Thank you for reporting this problem, we will take a closer look at that.