ngx-loading-spinners
Angular 7 custom async loading spinner with two simple methods for your asychronous calls.
Installation
npm i ngx-loading-spinners
Usage
Import module to your application master module
;
Make an import entry as shown below
imports: LoadingSpinnersModule
Include spinner component to your root level component.
You can use your own loader gif or svg file
- Set default spinner file.
; { _spinnersServicedefaultSpinnerFilePath = '/assets/images/page-loader.gif'; }
OR
- Define file path for each spinner.
Import
LoadingSpinnersService
to the component where you want to show the spinner.
;
Inject dependancy
public loaderUniqeName: String; { thisloaderUniqeName = 'loaderUniqeName'; }
Use
show(loaderName: String)
method to display the loading spinner.
this_spinnersService;
Use
hide(loaderName: String)
method to hide the loading spinner once the processing is done.
this_spinnersService;
You can use Spinner Service method to generate unique name
public loaderUniqeName: String; { thisloaderUniqeName = this_spinnersService; }