Progressbar inside Loading Component - InnerHTML sanitize issue


#1

Hi,

I’ve been trying to add a progress indicator inside a LoadingComponent (to inform the user about data downloading progress during application startup).

Exemple code :

this.loading = this.loadingController.create({
content: "<progressbar [max]=“100” [value]=“100” [type]=“info>”
});
this.loading.present();

The issue is that Angular 2 sanitizer remove the progressbar tag because (I suppose) the Loading content is injected inside an [innerHTML].

Since the “content” field only accepts a string, I can’t bypass Angular 2 sanitizer (with DomSanitizer.bypassSecurityTrustHtml).

The issue occurs both with the base HTML5 progress and the ng2-boostrap progressbar elements.

Does anyone knows a workaround for this ?
Have I missed something ?
Or is it a real issue that should be directly fixed in Ionic ?


#2

If anyone is trying to figure this out too, I had an answer on my stackoverflow question : http://stackoverflow.com/a/41531980/7273082