Show loading alert with SweetAlert2 without having to interact

user4878548 picture user4878548 · May 13, 2017 · Viewed 22.9k times · Source

Right now I have this code:

swal({
     title: 'Loading cars from data base',
     showLoaderOnConfirm: true,
     preConfirm: () => {
       return this.carsSvc.getCars().then((cars: ICar[]) => {
               this.setData(cars);
               resolve();
            });
    }
});

This code shows an alert, I have to press 'confirm' and then it shows a loading icon and closes when the loading is finished. I want only the last part of this action, so I don't want to have to confirm the loading before it begins to load. I want the loading to start when the alert is opened and to close automatically when the loading is finished. Is this possible with SweetAlert2?

Answer

Vic picture Vic · Nov 2, 2017

A little late probably but I figured this out. Try this:

swal({
     title: 'Loading cars from data base'
});
swal.showLoading();

this.carsSvc.getCars().then((cars: ICar[]) => {
           swal.close();
           this.setData(cars);
           // show a new success swal here?
        });

You want to call the swal.showLoading() method to disable buttons. You can then call swal.close() to finish.