Show progress with HttpClientModule in Angular

const request = new HttpRequest('GET', 'https://angularsamples.firebaseio.com/data.json',
  {reportProgress: true});

this.http.request(request).subscribe(value => {
  if (value.type === HttpEventType.DownloadProgress) {
    const newValue = value as HttpProgressEvent;
    const percent = Math.round(100 * newValue.loaded / newValue.total);
    console.log(percent);
  } else if (value.type === HttpEventType.Response) {
    console.log('File was completely downloaded!');
  }
});

 

References
https://angular.io/guide/http#listening-to-progress-events

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.