I am working on ionic 4 app. my app is working properly. Issue is that now i have list of objects having different prices and details. when i load the page everything is loaded but image take 2 3 second delay after data uploaded. i dont know how to resolve this. my html and .ts code is ass follow. any help would be appreciated.
<ion-row >
<ion-col size="12" [ngClass]="{'featured': isFeatured() }" class="result-image"
[ngStyle]="{'background-image': 'url(' + environment.API + 'images/'
+ itemType + '/' + data.coverImage + ')'}" no-padding>
</ion-col>
</ion-row>
<ion-row>
<ion-col size="7">{{ data.name }}</ion-col>
<ion-col size="5">
<ion-badge *ngIf="offer" class="offer" color="warning">{{ offer.strapline }}</ion-badge>
</ion-col>
</ion-row>
and my .ts code is as
isFeatured() {
return this.data.promotedListing &&
moment(this.date).isBetween(moment(this.data.promotedFrom), moment(this.data.promotedTo));
}
checkOffers(result: Venue | Event) {
const validOffers = [];
if (result.offers) {
result.offers.forEach(offer => {
const rule = new RRule({
dtstart: new Date(offer.rrule.dtstart),
until: new Date(offer.rrule.until),
freq: offer.rrule.freq,
byweekday: offer.rrule.byweekday,
bysetpos: offer.rrule.bysetpos || null,
bymonthday: offer.rrule.bymonthday || null,
byyearday: offer.rrule.byyearday || null,
count: offer.rrule.count || null,
byweekno: offer.rrule.byweekno || null,
});
const date = new Date(this.date);
console.log(date);
const occurences = rule.between(moment(date).utc().startOf('date').toDate(),
moment(date).utc().endOf('date').toDate());
occurences.forEach(occurance => {
validOffers.push(offer);
});
});
}
if (validOffers.length === 1) {
this.offer = validOffers[0];
}
if (validOffers.length > 1) {
this.offer = {
strapline: 'Multiple offers inside',
description: '',
duration: '',
};
}
}
check offer is called at ngOninIt.