File download progress in the browser: Angular 4 : <p>I'm creating an application that consumes a REST api for downloading a file. The api returns the file right when you hit it. So I'm using the following logic to get the file:</p>

<pre><code>downloadFile(file) {
this.service.downloadFile(file.id).subscribe((fileData) =&gt; {
  const a = document.createElement('a');
  document.body.appendChild(a);
  const blob = new Blob([data], { type: data.type });
  const url = window.URL.createObjectURL(blob);
  a.href = url;
  a.download = file.name;
  a.click();
  window.URL.revokeObjectURL(url);
});
</code></pre>

<p>}</p>

<p>The above code works perfectly. BUT, it downloads the file in the browser when the whole file is downloaded, i.e., you wont see the progress of file download in the browser (how we usually see when we download a file usually in Chrome). You can see its downloading the file in the 'network' tab of the console, but only shows up when the whole file is downloaded.
Can anybody give any idea how can I force it to download in the browser so that it shows the progress?</p>
