A callback method that is invoked immediately after the default change detector has checked the directive's data-bound properties for the first time, and before any of the view or content children have been checked. It is invoked only once when the directive is instantiated.
Array representing pages to be displayed in pagination controls.
Stores calculated sizes for pagination controls.
Pagination component for managing and displaying page navigation controls with various layouts and customizations.
Selector
app-pagination
Standalone
true
Imports
[CommonModule, FontAwesomeModule]
Description
This component renders pagination controls, allowing users to navigate through pages. The controls support horizontal and vertical layouts, customizable styles, and dynamic page content handling, with special support for breakout room navigation.
Example
Input
totalPages - Total number of pages available for navigation.
Input
currentUserPage - Current active page number.
Input
handlePageChange - Callback function to handle page changes.
Input
position - Horizontal position of the pagination controls (default is 'middle').
Input
location - Vertical position of the pagination controls (default is 'middle').
Input
direction - Layout direction of the pagination controls (default is 'horizontal').
Input
buttonsContainerStyle - Custom CSS styles for the buttons container.
Input
activePageStyle - CSS styles for the active page button.
Input
inactivePageStyle - CSS styles for inactive page buttons.
Input
backgroundColor - Background color for the pagination controls.
Input
paginationHeight - Height of the pagination controls in pixels.
Input
showAspect - Flag to display or hide the pagination controls.
Input
parameters - Additional configuration parameters for managing breakout rooms and related state.
Method
ngOnInit - Lifecycle hook that initializes the component and sets up page data.
Method
ngOnChanges - Handles input property changes to update page data when needed.
Method
handleClick - Asynchronously handles page button clicks and manages breakout room navigation logic.
Method
getPageStyle - Returns specific styles for a page button based on its active or inactive state.
Method
isBreakoutRoom - Checks if a page represents a breakout room.
Method
getDisplayItem - Returns the display label for a page, accounting for breakout room naming conventions.
Dependencies
This component requires an external pagination parameters configuration (
PaginationParameters) and access to theGeneratePageContentservice for managing dynamic content loading.