@progress/kendo-angular-pager
Version:
Kendo UI Angular Pager
80 lines (79 loc) • 3.69 kB
JavaScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
// eslint-disable no-access-missing-member
import { Component, ChangeDetectorRef, ChangeDetectionStrategy, HostBinding } from '@angular/core';
import { PagerElementComponent } from './pager-element.component';
import { LocalizationService } from '@progress/kendo-angular-l10n';
import { PagerContextService } from "./pager-context.service";
import * as i0 from "@angular/core";
import * as i1 from "@progress/kendo-angular-l10n";
import * as i2 from "./pager-context.service";
/**
* Represents the Kendo UI Pager Info component for Angular. Displays information about the current page and the total number of records ([see example]({% slug pager_settings %})).
*
* @example
* ```html
* <kendo-pager [skip]="skip" [pageSize]="pageSize" [total]="total">
* <ng-template kendoPagerTemplate>
* <kendo-pager-info></kendo-pager-info>
* </ng-template>
* </kendo-pager>
* ```
*/
export class PagerInfoComponent extends PagerElementComponent {
/**
* @hidden
*
* @readonly
* @type {number}
* @memberOf PagerInfoComponent
*/
get maxItems() {
return Math.min(this.currentPage * this.pageSize, this.total);
}
/**
* @hidden
*
* @readonly
* @type {number}
* @memberOf PagerInfoComponent
*/
get currentPageText() {
return this.total ?
(this.currentPage - 1) * this.pageSize + 1 :
0;
}
/**
* @hidden
*
* @readonly
* @type {boolean}
* @memberOf PagerInfoComponent
*/
hostClass = true;
constructor(localization, cd, pagerContext) {
super(localization, pagerContext, cd);
}
onChanges({ total, skip, pageSize }) {
this.total = total;
this.skip = skip;
this.pageSize = pageSize;
this.cd.markForCheck();
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerInfoComponent, deps: [{ token: i1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: i2.PagerContextService }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PagerInfoComponent, isStandalone: true, selector: "kendo-datapager-info, kendo-pager-info", host: { properties: { "class.k-pager-info": "this.hostClass" } }, usesInheritance: true, ngImport: i0, template: `{{currentPageText}} - {{maxItems}} {{textFor('of')}} {{total}} {{textFor('items')}}`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PagerInfoComponent, decorators: [{
type: Component,
args: [{
changeDetection: ChangeDetectionStrategy.OnPush,
selector: 'kendo-datapager-info, kendo-pager-info',
template: `{{currentPageText}} - {{maxItems}} {{textFor('of')}} {{total}} {{textFor('items')}}`,
standalone: true
}]
}], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: i2.PagerContextService }]; }, propDecorators: { hostClass: [{
type: HostBinding,
args: ['class.k-pager-info']
}] } });