To install this library, run:

$ npm install ng-http-loader --save

This package provides an HTTP Interceptor, and a spinner component. The HTTP interceptor listens to all HTTP requests and shows a spinner during pending requests.

From your Angular AppModule:

import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; [...] import { AppComponent } from './app.component'; import { NgHttpLoaderModule } from 'ng-http-loader/ng-http-loader.module'; @NgModule({ declarations: [ AppComponent ], imports: [ BrowserModule, NgHttpLoaderModule, ], providers: [], bootstrap: [AppComponent] }) export class AppModule { }

In your app.component.html, add :

<spinner></spinner>

Then, in order to have this module listening to your http requests, replace all the @angular/http usages by http: HttpInterceptorService.

Compatible with Angular 4+.

The spinner has been taken from SpinKit.