Skip to content

Latest commit

 

History

History
69 lines (50 loc) · 2.62 KB

infinite-pagination.component.md

File metadata and controls

69 lines (50 loc) · 2.62 KB
Raw
Title Added Status Last reviewed
Infinite Pagination component
v2.0.0
Active
2019-03-20

Infinite Pagination component

Adds "infinite" pagination to the component it is used with.

Infinite Pagination screenshot

Basic Usage

<adf-infinite-pagination
    [pageSize]="pageSize"
    [loading]="infiniteLoading"
    (loadMore)="loadNextPage($event)">
</adf-infinite-pagination>

Integrating with Document List

<adf-document-list #documentList ...></adf-document-list>

<adf-infinite-pagination 
    [target]="documentList"
    [loading]="documentList.infiniteLoading">
</adf-infinite-pagination>

Class members

Properties

Name Type Default value Description
isLoading boolean false Is a new page loading?
pageSize number Number of items that are added with each "load more" event.
target PaginatedComponent Component that provides custom pagination support.

Events

Name Type Description
loadMore EventEmitter<RequestPaginationModel> Emitted when the "Load More" button is clicked.

Details

Pagination is the process of dividing a list into separate ranges or "pages" with a certain number of items each. This allows a long list to be delivered in manageable pieces rather than all at once. "Infinite" pagination means that there is no upper limit on the number of items that can be displayed visually; a single page is shown initially but the user can extend the list one page at a time by clicking a "Load More" button.

The loadMore event is emitted when the button is pressed. It is passed a Pagination parameter which contains the details of the current page (the start offset of the page within the list to be shown, whether there are more items left to show, etc).

See the Pagination component for more information about the alternative "finite" pagination scheme.

See also