how to enable progress of downloading file using JavaScript or angular?

Question

when i'm trying to download a file entire file is getting downloaded at once not able to see progress

below is the expected output

i tried below 2 approaches but didn't help

Approach 1

tried using file saver

FileSaver.saveAs(blob, "hello world.txt");

Approach 2 using pure javascript

  downloadFileDirect(blob){
      var a = document.createElement('a');
    var bb = new Blob([blob], { type: 'text/plain' });
    a.download = 'Upload.xlsx';
    a.href = window.URL.createObjectURL(bb);
    a.textContent = 'Download ready';
    a.click();    
  }

in both the approaches file is getting downloaded at once

in backend its springboot

Answer 1

It's the browser that handles the download progress not Angular.