Documentation
Documentation Hub

BasePagination

Straight shape

The pagination component can have different shapes. Use the shape prop to change the shape of the pagination.

Default shape of all <BasePagination> can be set in your .app/app.config.ts.
Show code

Rounded shape

The pagination component can have different shapes. Here is an example of a rounded pagination.

Show code

Smooth shape

The pagination component can have different shapes. Here is an example of a smooth pagination.

Show code

Curved shape

The pagination component can have different shapes. Here is an example of a curved pagination.

Show code

Full shape

The pagination component can have different shapes. Here is an example of a full pagination.

Show code

#<BasePagination>

Properties

item-per-page
The number of items to display per page.
Required
Show example
total-items
The total number of items.
Required
Show example
shape
The shape of the pagination.
Show example
current-page
The current page number.
Show example
max-links-displayed
The maximum number of links to display.
Show example
router-query-key
The query key to use for routing.
Show example
previous-icon
The icon to show for the previous button.
Show example
next-icon
The icon to show for the next button.
Show example
ellipsis
The ellipsis to show when there are too many links.
Show example
no-router
Whether to disable routing.
Show example

Events

@update:currentPage
Show example

Slots

#before-pagination
Show example
#after-pagination
Show example
#before-navigation
Show example
#after-navigation
Show example