IgxPaginatorComponent

Paginator component description

Constructors

new IgxPaginatorComponent(): IgxPaginatorComponent

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:270

Returns IgxPaginatorComponent

Properties

pageChange

Emitted after the current page is changed.

pageChange: EventEmitter<number>

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:94

Example

<igx-paginator (pageChange)="onPageChange($event)"></igx-paginator>

public onPageChange(page: number) {
  this.currentPage = page;
}

paging

Emitted before paging is performed.

paging: EventEmitter<IPageCancellableEventArgs>

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:107

Remarks

Returns an object consisting of the current and next pages.

Example

<igx-paginator (paging)="pagingHandler($event)"></igx-paginator>

pagingDone

Emitted after paging is performed.

pagingDone: EventEmitter<IPageEventArgs>

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:120

Remarks

Returns an object consisting of the previous and current pages.

Example

<igx-paginator (pagingDone)="pagingDone($event)"></igx-paginator>

perPageChange

Emitted when perPage property value of the paginator is changed.

perPageChange: EventEmitter<number>

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:78

Example

<igx-paginator (perPageChange)="onPerPageChange($event)"></igx-paginator>

public onPerPageChange(perPage: number) {
  this.perPage = perPage;
}

totalPages

Total pages calculated from totalRecords and perPage

totalPages: number

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:125

Accessors

isFirstPage

Returns if the current page is the first page.

const lastPage = this.paginator.isFirstPage;

get isFirstPage(): boolean

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:292

Returns boolean

isLastPage

Returns if the current page is the last page.

const lastPage = this.paginator.isLastPage;

get isLastPage(): boolean

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:282

Returns boolean

nativeElement

get nativeElement(): any

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:315

Returns any

overlaySettings

Sets custom OverlaySettings.

<igx-paginator [overlaySettings] = "customOverlaySettings"></igx-paginator>

get overlaySettings(): OverlaySettings

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:245

Returns OverlaySettings

set overlaySettings(value: OverlaySettings): void

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:249

Parameters

value: OverlaySettings

Returns void

page

Gets/Sets the current page of the paginator. The default is 0.

let page = this.paginator.page;

get page(): number

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:150

Returns number

set page(value: number): void

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:154

Parameters

value: number

Returns void

perPage

Gets/Sets the number of visible items per page in the paginator. The default is 15.

let itemsPerPage = this.paginator.perPage;

get perPage(): number

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:181

Returns number

set perPage(value: number): void

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:185

Parameters

value: number

Returns void

resourceStrings

An accessor that returns the resource strings.

get resourceStrings(): IPaginatorResourceStrings

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:266

Returns IPaginatorResourceStrings

An accessor that sets the resource strings. By default it uses EN resources.

set resourceStrings(value: IPaginatorResourceStrings): void

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:259

Parameters

value: IPaginatorResourceStrings

Returns void

selectOptions

Sets custom options in the select of the paginator

let options = this.paginator.selectOptions;

get selectOptions(): number[]

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:229

Returns number[]

set selectOptions(value: number[]): void

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:233

Parameters

value: number[]

Returns void

totalRecords

Sets the total records.

let totalRecords = this.paginator.totalRecords;

get totalRecords(): number

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:207

Returns number

set totalRecords(value: number): void

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:211

Parameters

value: number

Returns void

Methods

Goes to the next page of the paginator, if the paginator is not already at the last page.

this.paginator.nextPage();

nextPage(): void

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:327

Returns void

paginate

Goes to the desired page index.

this.paginator.paginate(1);

paginate(val: number): void

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:354

Parameters

val: number

Returns void

Goes to the previous page of the paginator, if the paginator is not already at the first page.

this.paginator.previousPage();

previousPage(): void

Defined in projects/igniteui-angular/paginator/src/paginator/paginator.component.ts:340