I’m trying to use ion-infinite-scroll in my app. It works Properly on the browser but once I build the apk using capacitor the ion-infinite scroll no longer shows in the apk and doesn’t do anything.
<ion-content mode="ios">
<ion-list>
<ion-card long-press (press)="selectRequest(req,i)" (click)="multipleSelect(req,i)" *ngFor="let req of reqList; let i = index" [ngClass]="{'confirmrq-selected': req.check == true}" class="confirmrq-card ion-padding">
<ion-row class="confirm-rqtitle">
<ion-col class="confirmrq-namecol"><h2>{{req | filterName : lang}}</h2></ion-col>
<ion-col class="confirmrq-datecol">
<h1>{{req.strDate}}</h1>
</ion-col>
</ion-row>
<ion-row>
<ion-col class="confirmrq-type">
<ion-icon *ngIf="req.type == 0" src="assets/custom-ion-icons/icon-leave.svg"></ion-icon>
<ion-icon *ngIf="req.type == 1" src="assets/custom-ion-icons/icon-vac.svg"></ion-icon>
<ion-icon *ngIf="req.type == 2" src="assets/custom-ion-icons/icon-mission.svg"></ion-icon>
<ion-icon *ngIf="req.type == 3" src="assets/custom-ion-icons/icon-mission.svg"></ion-icon>
<ion-icon *ngIf="req.type == 4" src="assets/custom-ion-icons/icon-adv.svg"></ion-icon>
<ion-icon *ngIf="req.type == 5" src="assets/custom-ion-icons/icon-order.svg"></ion-icon>
<h2 *ngIf="req.type == 0">{{'dlr'| translate}}</h2>
<h2 *ngIf="req.type == 1">{{'leaving'| translate}}</h2>
<h2 *ngIf="req.type == 2">{{'dMissReq'| translate}}</h2>
<h2 *ngIf="req.type == 3">{{'mrh'| translate}}</h2>
<h2 *ngIf="req.type == 4">{{'advRequest'| translate}}</h2>
<h2 *ngIf="req.type == 5">{{'order'| translate}}</h2>
</ion-col>
<ion-col class="confirmrq-time">
<h1>{{req.strTime | tFormat : lang}}</h1>
</ion-col>
</ion-row>
<ion-row>
<ion-col class="req-duration">
<ion-icon name="calendar"></ion-icon>
<h3>{{req.strFromDate}} {{'to' | translate}} {{req.strToDate}}</h3>
</ion-col>
<ion-col>
<div *ngIf="req.type == 4">
<h1 *ngIf="req.status == 0" class="btn-status bg-color-def" >{{'stWithout'|translate}}</h1>
<h1 *ngIf="req.status == 1" class="btn-status bg-color-success" >{{'stApproved'|translate}}</h1>
<h1 *ngIf="req.status == 2" class="btn-status bg-color-danger" >{{'stRefused'|translate}}</h1>
<h1 *ngIf="req.status == 3" class="btn-status bg-color-warn" >{{'stCanceled'|translate}}</h1>
</div>
<div *ngIf="req.type != 4">
<h1 *ngIf="req.status == 0 && req.supervisorStatus == 0" class="btn-status bg-color-def" >{{'stWithout'|translate}}</h1>
<h1 *ngIf="req.status == 1" class="btn-status bg-color-success" >{{'stApproved'|translate}}</h1>
<h1 *ngIf="req.status == 2" class="btn-status bg-color-danger" >{{'stRefused'|translate}}</h1>
<h1 *ngIf="req.status == 0 && req.supervisorStatus == 3" class="btn-status bg-color-success" >{{'stSuperApproved'|translate}}</h1>
<h1 *ngIf="req.status == 0 && req.supervisorStatus == 4" class="btn-status bg-color-danger" >{{'stSuperRejected'|translate}}</h1>
<h1 *ngIf="req.status == 5" class="btn-status bg-color-warn" >{{'stCanceled'|translate}}</h1>
</div>
</ion-col>
</ion-row>
<ion-row class="confirmrq-btn">
<ion-button class="view-btn" (click)="viewRequest(req)" >{{'view' | translate}}</ion-button>
<ion-button *ngIf="req.status == 0 || (isAdmin && req.type != 4 && (req.supervisorStatus == 3 || req.supervisorStatus == 4)) && req.status==0" (click)="confirmRequset(req , i)" class="approve-btn">{{'approve' | translate}}</ion-button>
<ion-button *ngIf="req.status == 0 || (isAdmin && req.type != 4 && (req.supervisorStatus == 3 || req.supervisorStatus == 4)) && req.status==0" (click)="rejectRequest(req, i)" class="reject-btn">{{'reject' | translate}}</ion-button>
</ion-row>
</ion-card>
</ion-list>
<ion-infinite-scroll threshold="15px" (ionInfinite)="loadMoreRequests($event)">
<ion-infinite-scroll-content
loadingSpinner="bubbles"
loadingText="{{'loadingData' | translate}}">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
</ion-content>
Any Help Please. I tried it on android 8 and 9 devices and it doesn’t work on both even though it’s working properly on the browser.
Thank you.