简体   繁体   中英

Angular Application: How to change the name of a pdf file when downloaded from an API?

In my angular 7 application,

I have an API, which, when called, will download a PDF for the user. One issue, is that when the PDF is downloaded, the name appears as '[object Blob]'. How can I make it so the same is something else, like, 'Confirmation PDF'?

In my service file:

  getPdfCal(payload) {
    return this.http.get(environment.apiUrl + '/report/getPdfCal',
    { headers: this.getSearchApiHeaders(payload), responseType: 'blob' });
  }

In my component TS file:

  getPdf(transactionNbr) {
    if(transactionNbr !== null) {
    const transactionNumberString = transactionNbr+'';
    const payload = { Id: this.IdHeader, Yr: this.Year, transactionNbr: transactionNumberString }
    this.studentService.getPdfCal(payload).subscribe((response: any) => {

    let dataType = "application/pdf";
    let binaryData = [];

    binaryData.push(response);

    let downloadLink = document.createElement('a');

    downloadLink.href = window.URL.createObjectURL(new Blob(binaryData, { type: dataType }));
    if (response)
      downloadLink.setAttribute('download', response);
    document.body.appendChild(downloadLink);
    downloadLink.click();

  })

 }
}

Here is a screenshot of the file when it is downloaded from the API 在此处输入图片说明

download属性将设置下载文件的文件名。

downloadLink.download = 'hello.pdf'

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM