如何使用 Angular 5 下载文件？

Question

当我将my_example_link 粘贴到浏览器中时，文件会以正确的方式自动下载。但是，当我使用下面显示的源代码时，下载不起作用。单击download 按钮后，我想下载文件。有什么想法有什么问题吗？我没有收到任何错误。

user.service.ts:

DownloadFiles() {

    return this.http.get('my_example_link', {responseType: 'text'});

}

uploader.service.ts：

DownloadFile(){

      this.userService.DownloadFiles()
          .subscribe(
              (data) => this.downloadFile2(data)), // console.log(data),
              (error) => console.log("Error downloading the file."),
              () => console.info("OK");
}

downloadFile2(data: Response){
  var blob = new Blob([data], { type: 'text/csv' });
  var url= window.URL.createObjectURL(blob);
  window.open(url);
}

something.component.html：

<li class="nav-item" *ngIf="isCloud()">
    <a  (click)="this.UploaderService.DownloadFile()" download="file23.txt" style='cursor: pointer;' class="nav-link" target="_blank">
        <i class="nc-icon nc-basket"></i> Download
    </a>
</li>

Answer 1

使用数组缓冲区

this.httpClient.get(url, {responseType: 'arraybuffer',headers:headers});

保存文件：

 npm install file-saver --save

 import { saveAs } from 'file-saver/FileSaver';

组件：

downLoadFile(data: any, type: string) {
        var blob = new Blob([data], { type: type.toString() });
        var url = window.URL.createObjectURL(blob);
        saveAs(blob,"file_name.txt");
        window.open(url);

    }