Web SDK documentation
  1. Components
  2. PaginatedListGroupComponent

File

auth-configuration/sso-configuration/template-parts/access-mapping/paginated-list-group.component.ts

Implements

OnInit OnChanges AfterViewInit

Metadata

selector c8y-paginated-list-group
standalone true
imports CoreModule PaginationModule
templateUrl ./paginated-list-group.component.html

Index

Properties
Methods
Inputs

Inputs

items
Type : T[]
Default value : []
itemsPerPage
Type : number
Default value : 5

Methods

getItemIndex
getItemIndex(item: T)
Parameters :
Name Type Optional
item T No
Returns : number
goToLastItem
goToLastItem()
Returns : void
ngAfterViewInit
ngAfterViewInit()
Returns : void
ngOnChanges
ngOnChanges()
Returns : void
ngOnInit
ngOnInit()
Returns : void
pageChanged
pageChanged(event: PageChangedEvent)
Parameters :
Name Type Optional
event PageChangedEvent No
Returns : void
updateCurrentPageItems
updateCurrentPageItems()
Returns : void

Properties

currentPage
Type : number
Default value : 1
currentPageItems
Type : T[]
Default value : []
itemTemplate
Type : TemplateRef<any>
Decorators :
@ContentChild(TemplateRef)
 
<div
  class="container-fluid"
  *ngIf="items.length > 0"
>
  <c8y-list-group>
    <c8y-li *ngFor="let item of currentPageItems; let i = index">
      <ng-container
        *ngTemplateOutlet="itemTemplate; context: { $implicit: item, index: getItemIndex(item) }"
      ></ng-container>
    </c8y-li>
    <c8y-li class="sticky-bottom">
      <pagination
        [totalItems]="items.length"
        [(ngModel)]="currentPage"
        [ngModelOptions]="{ standalone: true }"
        [itemsPerPage]="itemsPerPage"
        (pageChanged)="pageChanged($event)"
        [maxSize]="10"
        [boundaryLinks]="true"
        previousText="&nbsp;"
        nextText="&nbsp;"
        firstText="&laquo;"
        lastText="&raquo;"
      ></pagination>
    </c8y-li>
  </c8y-list-group>
</div>

results matching ""

    No results matching ""