alfresco-ng2-components/docs/core/infinite-pagination.component.md
Eugenio Romano 07c247ca11 [ADF-2500] fix trashcan bug plus refactoring documentlist (#3136)
* [ADF-2500] The full content of Trashcan is not displayed.

fix pagination problem and add tests

* refactor code

* custom resources services

* move custom resources in separate service part 2

* move custom resources in separate service part 3

* move isCustomResources in custom resources

* move getCorrispondinNodeIds in custom services

* reorganize code

* add pagination interface

* remove permissions check document list and use the common cs method
remove the merge option and move it in the paginator

* make infinte scrolling always use the target

* restore loading infinite page

* fix license header

* fix type problems

* breadcrumb test service

* fix test

* export CustomResourcesService

* fix test pagination

* fix content ndoe test

* remove timeout content node selector test

* fix after rebase

* ripristinate observalbe in search service

* fix wrong type return stub document list test

* fix search service

* fix test document list

* move handle error in common method

* restore observable in search control

* Update search-control.component.spec.ts

* fix after rebase

* add import switchmap

* core import in karma conf

* missing commas

* fix mocks

* fix mock searchquerybody

* search test fix
2018-04-09 10:31:43 +01:00

2.2 KiB

Added, Status
Added Status
v2.0.0 Active

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">
</adf-infinite-pagination>

Properties

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

Events

Name Type Description
loadMore EventEmitter<Pagination> 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