Я получаю URL-адрес iframe от api, и мне нужно загрузить URL-адрес iframe из api в мой HTML-код в приложении angular 7. Пока я не получу URL, я покажу пользователям загрузчик. который работает все отлично до сих пор. Но после этого, когда содержимое iframe загружается в dom, это занимает несколько секунд. На данный момент моя страница пуста. Я хочу показать загрузчик и в этом разрыве.
Как этого добиться?
urlToOpen: any;
ionViewDidLoad() {
this.dataProcess();
}
dataProcess() {
this.canShowLoader = true;
// @ts-ignore
this.pusher.getEngageMdData().take(1).timeout(60 * 1000).subscribe(
data => {
this.canShowLoader = false;
this.urlToOpen = this.sanitizer.bypassSecurityTrustResourceUrl(data.data);
},
(error) => {
// console.log('error occurred', error);
this.canShowLoader = false;
},
() => {
// console.log('done');
this.canShowLoader = false;
}
);
}
<iframe *ngIf="canShowLoader === false" [src]="urlToOpen" data-tap-disabled="true"></iframe>
<div class="loadingDiv" *ngIf="canShowLoader === true">
<div class="loading_bg d-flex h-100">
<div style="width: 70rem !important;" class="loader justify-content-center align-self-center"><div>
<span style="color: white; font-size: 1.9rem">{{loadingMsg}}</span>
<ion-spinner color="white"></ion-spinner>
</div>
</div>
</div>