Page 1 of 1

Start and stop a spinner in IONIC

Posted: Thu Oct 15, 2020 1:06 am
by kevinmcisaac

I have a long running (2-10 sec) Typescript (reads many files), run from a button click event, and I want to show a spinner.

If I look at events on the button there is a "present loading" to start a spinner, but no event to to stop it.

I found an article that suggested using showSpinner / hideSpinner, but that was for jQuery and this does not seem to work in my ionic project. WHen I tried that I got
ERROR in src/app/ImportParaJournal/ImportParaJournal.ts:170:9 - error TS2304: Cannot find name 'showSpinner'.

170 showSpinner();

Code: Select all

src/app/ImportParaJournal/ImportParaJournal.ts:187:9 - error TS2304: Cannot find name 'hideSpinner'.

187         hideSpinner();

Re: Start and stop a spinner in IONIC

Posted: Fri Oct 16, 2020 8:51 am
by Serhii Kulibaba

Hello,

hideSpinner() and showSpinner() are used in JQM apps only.

In Ionic 4 you can use any spinner: https://ionicframework.com/docs/api/spinner
Just add it to the HTML component. To hide/show it you can use the simple directive *ngIf https://angular.io/api/common/NgIf