Ionic Framework - $ ionicLoading: how to display both spinner and label?

Question

I do not see the ability to display both the counter and the label! Docs .

Is there an easy way to do this, or should it be what I have to do myself?

Example (this, of course, is not necessary): http://www.jqueryscript.net/images/jQuery-Ajax-Loading-Overlay-with-Loading-Text-Spinner-Plugin.jpg

Thanks!

Answer 1

You can try the following:

$ionicLoading.show({ template: '<ion-spinner></ion-spinner> <br/> My Label' }); 

Not tested, I think it will show a spinner, but maybe an animation.

Answer 2

You can upload your template:

 <script id="loading.html" type="text/ng-template"> <ion-spinner icon="bubbles"></ion-spinner> <p>LOADING...</p> </script> 

and in your code:

 $ionicLoading.show({ templateUrl: 'loading.html' // noBackdrop: true }); 

or, as Nam Pham suggested, defined an inline template:

 $ionicLoading.show({ template: '<ion-spinner icon="bubbles"></ion-spinner><p>LOADING...</p>' // noBackdrop: true }); 

If you want, you can define another spinner .

You can see how it works here .