如何在 Angular2 中成功从 WebApi/MVC 应用程序下载文件？

使用 Angular2 进行有效的文件下载

在您的 Angular2 应用程序中，您在保存从 WebApi / MVC 应用程序下载的文件时遇到了困难。让我们深入研究您的问题并提供解决方案。

您的组件代码（如所提供）利用 Blob() 构造函数根据接收到的数据创建文件。然而，您面临着 URL.createObjectURL 函数的挑战，该函数在当前的 ECMAScript 规范中不可用。

解决方案源于 Angular2 中可观察量的本质。用于下载文件的可观察对象在不同的​​上下文中执行，从而导致您遇到的问题。为了解决这个问题，我们需要修改代码来订阅可观察量，并在该订阅中执行文件创建和保存逻辑。

一种有效的方法是重构 downloadfile() 方法以订阅可观察量为如下：

downloadfile(type: string){
  this.pservice.downloadfile(this.rundata.name, type)
    .subscribe(data => {
      this.downloadFile(data); // Call a separate function to handle file creation and saving
    },
    error => console.log("Error downloading the file."),
    () => console.log('Completed file download.'));
}

在这个更新的方法中，我们引入了一个新的 downloadFile() 函数，它负责创建文件并启动下载。

downloadFile(data: Response) {
  const blob = new Blob([data], { type: "application/octet-stream" });
  const url = window.URL.createObjectURL(blob);
  window.open(url);
}

通过订阅可观察的并定义 downloadFile() 函数，我们确保文件创建和保存在正确的上下文中进行，使您能够成功保存和打开下载的文件。

以上是如何在 Angular2 中成功从 WebApi/MVC 应用程序下载文件？的详细内容。更多信息请关注PHP中文网其他相关文章！