Vmeda.Online/src/core/components/infinite-loading/core-infinite-loading.html

31 lines
1.4 KiB
HTML

<ng-container *ngIf="!loadingMore && position !== 'top'">
<div *ngIf="enabled || error" class="ion-padding-horizontal" #bottombutton>
<ion-button *ngIf="!error" expand="block" (click)="loadMore()" fill="outline">
{{ 'core.loadmore' | translate }}
</ion-button>
<ion-button *ngIf="error" expand="block" (click)="loadMore()" fill="outline">
{{ 'core.tryagain' | translate }}
</ion-button>
</div>
</ng-container>
<!-- Don't allow disabling infinite-scroll while loading more items, otherwise infinite scroll stops working. -->
<ion-infinite-scroll [disabled]="!loadingMore && (!enabled || error)" (ionInfinite)="loadMore()" [position]="position">
<ion-infinite-scroll-content />
</ion-infinite-scroll>
<ng-container *ngIf="!loadingMore && position === 'top'">
<div *ngIf="enabled || error" class="ion-padding-horizontal" #topbutton>
<ion-button *ngIf="!error" expand="block" (click)="loadMore()" fill="outline">
{{ 'core.loadmore' | translate }}
</ion-button>
<ion-button *ngIf="error" expand="block" (click)="loadMore()" fill="outline">
{{ 'core.tryagain' | translate }}
</ion-button>
</div>
</ng-container>
<div *ngIf="loadingMore" class="ion-padding ion-text-center" #spinnercontainer>
<ion-spinner [attr.aria-label]="'core.loading' | translate" />
</div>