Angular2 如何處理檔案下載
在 Angular2 及更高版本中,下載檔案涉及使用 Observables 和 Blob 來擷取和保存資料。讓我們探討 Angular 應用程式下載檔案的特定場景。
理解問題
使用者在 Angular2 用戶端中實作檔案下載功能時遇到問題WebApi/MVC 應用程式。他們正確設定了請求,但很難理解 Angular 如何管理文件保存。
解決方案
問題的出現是因為處理文件下載的 Observable 運行在一個單獨的上下文中。這會導致將空物件傳遞到 URL 變數中,而不是所需的 blob。
為了解決這個問題,解決方案涉及以將資料作為回應直接傳遞給指定函數的方式訂閱Observable ,如:
this._reportService.getReport().subscribe(data => this.downloadFile(data));
在downloadFile 函數中,使用回應建立blob data :
downloadFile(data: Response) { const blob = new Blob([data], { type: 'text/csv' }); const url = window.URL.createObjectURL(blob); window.open(url); }
透過分別處理訂閱和blob 創建,建立正確的上下文,確保URL 變數包含所需的blob。
其他注意事項
為了確保成功開啟文件,驗證「rxjs/Rx」是否已被開啟非常重要import:
import 'rxjs/Rx';
此解決方案透過正確處理Observable 和blob 創建發生的上下文來解決該問題。它使 Angular2 應用程式能夠有效地下載檔案。
以上是如何使用 Observables 和 Blob 在 Angular2 中下載檔案?的詳細內容。更多資訊請關注PHP中文網其他相關文章!