Ionic 8 LoadingController and HTML content

Using @ionic/angular@8.4.0 here’s the code-snippet from the docs.

import { Component } from '@angular/core';

import { LoadingController } from '@ionic/angular';

@Component({
  selector: 'app-example',
  templateUrl: 'example.component.html',
})
export class ExampleComponent {
  constructor(private loadingCtrl: LoadingController) {}

  async showLoading() {
    const loading = await this.loadingCtrl.create({
      message: 'Dismissing after 3 seconds...',
      duration: 3000,
    });

    loading.present();
  }
}

How do you allow for HTML content in the message text? In older versions of Ionic this was as simple as making using an HTML string in the content field of the LoadingOptions object passed to this.loadingCtrl.create(opts), but the content field is not there anymore in Ionic 8 and passing HTML content in the message field just renders the HTML tags as plain text. I’ve also tried using an IonicSafeString wrapper around the message, but then it just spits out ‘undefined’ for the loader message. How are you supposed to do this in Ionic 8?

1 post - 1 participant

Read full topic