Overview

Pager

wuic-pager is the pagination component that drives currentPage and pageSize of the datasource.

Description

Supports classic page-based paging and cursor paging (next/prev token).
Synchronizes with the datasource's fetchInfo and updates totals/pages.
Can receive preferred paging from input (pageSize, currentPage, forcedPageSize).

API

Selector:

wuic-pager

Input:

datasource: BehaviorSubject<DataSourceComponent>
hardcodedDatasource: DataSourceComponent
pageSize: number
currentPage: number
forcedPageSize: number

Output:

onPagerDataBound: EventEmitter<{ currentPage, pageSize, totalPages, totalRecords, cursorMode }>
onPagerPageChange: EventEmitter<{ currentPage, pageSize, totalPages, cursorMode, direction }>
onPagerPageSizeChange: EventEmitter<{ pageSize, currentPage }>
onPagerBusyChange: EventEmitter<boolean>

Main public methods:

prevPage()
nextPage()
firstPage()
lastPage()
applyPageSize()
applyCurrentPage()

Events and Subscriptions (Host)

Snippet 1ts

@ViewChild(PagerComponent) pager?: PagerComponent;
private readonly subs = new Subscription();

ngAfterViewInit(): void {
  if (!this.pager) return;
  this.subs.add(this.pager.onPagerDataBound.subscribe((e) => console.log(e)));
  this.subs.add(this.pager.onPagerPageChange.subscribe((e) => console.log(e)));