how to apply cssClass on custom LoadingController

Question

According to this http://ionicframework.com/docs/v2/api/components/loading/LoadingController/ i can apply cssClass to loadingCtrl.

this is my funtion

presentLoadingCustom() {
    this.loading = this.loadingCtrl.create({
      spinner: 'hide',
      content: `
        <img src="assets/images/loader/loading.gif" class="img-align" />
        `,
      cssClass:`
      //below class in inbuilt class 
       .loading-wrapper{
        background:none;
        box-shadow: none;
      }
      .img-align{
        height:80px;
      }`
    });
    this.loading.present();
  }

i am not able to see my loader after i applied the cssClass but i need this two class to be applied to my custom image loader.

Answer 1

As per documentation cssClass option accepts classes for custom styles, separated by spaces only not the way you have passed css to it. so change your presentLoadingCustom function as below :

presentLoadingCustom() {
  this.loading = this.loadingCtrl.create({
    spinner: 'hide',
    content: `<img src="assets/images/loader/loading.gif" class="img-align" />`,
    cssClass:`loading-wrapper img-align`
  });

  this.loading.present();
}

You have to add your loading-wrapper and img-align classes style definitation into your css file not in create method of LoadingController.