furo-ui5-pagination-bar #

@furo/ui5 v1.18.0
import '@furo/ui5/src/furo-ui5-pagination-bar.js';
exports FuroUi5PaginationBar js
exports <furo-ui5-pagination-bar> custom-element-definition
superclass LitElement
mixes FBP

Summary: Pagination Bar

Description #

The furo-ui5-pagination-bar element loops the hateoas array and finds out the pagination information like prev, next, first and last

  <furo-ui5-pagination-bar fn-inject="--hateoas"></furo-ui5-pagination-bar>

Example #

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11

<furo-ui5-pagination-bar 
  fn-inject="--responseHts" 
  @-pagination-next="--next" 
  @-pagination-last="--last"></furo-ui5-pagination-bar>
<furo-collection-agent 
  service="projectservice.ProjectService" 
  fn-hts-in="--hts" 
  fn-next="--next" 
  fn-last="--last"
  @-response-hts-updated="--responseHts">
</furo-collection-agent>

Attributes and Properties #

currentPage #

currentPage number default: 0

first #

first boolean

prev #

prev boolean

next #

next boolean

last #

last boolean

Events #

hts-injected #

at-hts-injected → CustomEvent

pagination-first #

at-pagination-first → ``

Is fired if the pagination button ‘sys_first_page’ was clicked

pagination-last #

at-pagination-last → ``

Is fired if the pagination button ‘sys_last_page’ was clicked

pagination-prev #

at-pagination-prev → ``

Is fired if the pagination button ‘sys_prev_page’ was clicked

pagination-next #

at-pagination-next → ``

Is fired if the pagination button ‘sys_next_page’ was clicked

Methods #

inject #

inject(hts `` ) ⟹ void

`` → fn-inject

init pagination attributes Supported type: furo.Link

• hts
  
  

Slots #

start #

Type: HTMLElement

Defines the content at the start of the bar

default #

Type: HTMLElement

Defines the content in the middle of the bar Tags: pagination

Styling #

The following custom properties available for styling: