Chargeur gif lorsque le composant charge angulaire 2

Question

J'utilise ng2-pdf-viewer pour afficher un pdf. Pour l'instant, lorsque le pdf est en chargement, la page blanche apparaît. Je veux ajouter un chargeur gif pendant que le pdf charge et le cache quand le chargement est terminé. Toute aide est appréciée.

Answer 1

Utilisez pace.js. Aucune configuration requise :)

Answer 2

ng2-pdf-viewer fournit un événement after-load-completed, que vous pouvez utiliser pour masquer le gif. Et, un autre événement appelé on-progress, que vous pouvez utiliser pour configurer un booléen à true, utilisez alors dans un * ngIf, comme ceci:

<pdf-viewer 
    [src]="pdfSrc" [render-text]="true" (on-progress)="showGif($event)"> 
</pdf-viewer> 

<img src="loading.gif" *ngIf="loading"/> 

dans votre classe de composant, faites ceci:

(...) 
public loading = false; 
(...) 

showGif(event: {loaded: number, total: number}) { 
this.loading = loaded < number; 
}