Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


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();

}}


Arkadiusz Idzikowski staff commented 5 years ago

Thank you for reporting this problem, we will take a closer look at that.



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Opened

Specification of the issue

  • 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