Introduction to ngx-spinner

While building a web application, we’ll encounter scenarios where we have to fetch data from a back-end resource. This process is asynchronous in nature, making it necessary to use a preloader. A preloader is a static picture or animated figure displayed on the browser while an application is loading in the background. The preloader disappears once the data fetched on the application is ready.

In this project, we’ll use the npm package called ngx-spinner to set up our preloader. The ngx-spinner is an npm package well suited for Angular, and it has features such as the following:

  • Configuration option through service injection
  • Full screen mode (optional)
  • Multiple loaders
  • Promised-based response using the show() and hide() methods

Note: We can follow the instructions in the appendix to install ngx-spinner@11.0.2 to our application.

Get hands-on with 1200+ tech skills courses.