Problem using ion-spinner in real device

ionic-v1
1

Hi, im having some trouble using the ion-spinner.

I am using it for the loading state in the application while i am loading some list. While i test in the browser using ionic serve --lab it displays the spinner ok but when i test it on my device the spinner doesnt appear.$ionicLoading.show({templateUrl:’…/templates/loading.html’});

I have a template with the loading that only contains the following

   <ion-spinner />

And i use the $ionicLoading.show as following:

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

And as i said the ion-spinner works perfectly in the browser (using perfectly different spinners for iOS and Android in the ionic serve --lab) but when i test it in a real device it doesn’t work.

Any help will be really appreciated since i have no idea why this could be.

A lot of thanks in advance,

Best Regards.

2

Besides this problem i just try to alter my loading.html to just display a string “loading…” And it still doesnt work. It only works the backdrop but the loading text doesn’t appear nor the litlle popUp that is usually in the ionic loading.

Any help please i will appreciate it.

Thanks in advance, again!

EDIT: I just tried something that was without using templateUrl but writing the template just right there in the controller instead of in a html and it worked for displaying just text, the ion-spinner tag didn’t work!

So, maybe this is an issue and we cant use templateUrl or what?

Thanks

3

Also having this issue! See my question on this also (basically the same issue): Ion spinners not appearing

4

Make sure to update Ionic lib – I think there were some changes that might have impacted this not too long ago. I use this exact code and I see the spinner:

templates/login-loader.html

<ion-spinner icon="android" class="spinner-assertive"></ion-spinner>
<br><br>
<span style="font-weight: bold;" id="loader-msg">{{loadingMessage}}</span>

In my controller:

$scope.loadingMessage = "Loading...";

$ionicLoading.show({
  templateUrl: 'templates/login-loader.html',
  animation: 'fade-in',
  scope: $scope,
  hideOnStateChange: true
});

Good luck!