Bagaimana untuk Muat Turun Fail dalam Angular2 Menggunakan Observables dan Blobs?

Cara Angular2 Mengendalikan Muat Turun Fail

Dalam Angular2 dan lebih tinggi, memuat turun fail melibatkan penggunaan Observables dan Blobs untuk mendapatkan dan menyimpan data. Mari kita terokai senario tertentu di mana aplikasi Angular memuat turun fail.

Memahami Masalah

Seorang pengguna menghadapi masalah apabila melaksanakan fungsi muat turun fail dalam klien Angular2 untuk Apl WebApi/MVC. Mereka telah menyediakan permintaan dengan betul, tetapi bergelut untuk memahami cara Angular menguruskan penyimpanan fail.

Penyelesaian

Isu timbul kerana Observable yang mengendalikan muat turun fail berjalan dalam konteks yang berasingan. Ini membawa kepada objek kosong dihantar ke dalam pembolehubah URL dan bukannya gumpalan yang diingini.

Untuk menangani perkara ini, penyelesaiannya melibatkan melanggan Observable dengan cara yang menghantar data sebagai respons terus kepada fungsi yang ditetapkan , seperti:

this._reportService.getReport().subscribe(data => this.downloadFile(data));

Dalam fungsi muat turunFail, gumpalan dibuat menggunakan data tindak balas:

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

Dengan mengendalikan langganan dan penciptaan gumpalan secara berasingan, konteks yang betul diwujudkan , memastikan pembolehubah URL mengandungi gumpalan yang dikehendaki.

Pertimbangan Tambahan

Untuk memastikan pembukaan fail berjaya, adalah penting untuk mengesahkan bahawa 'rxjs/Rx' telah diimport:

import 'rxjs/Rx';

Penyelesaian ini menangani isu dengan mengendalikan konteks dengan betul di mana penciptaan Observable dan gumpalan berlaku. Ia membolehkan aplikasi Angular2 memuat turun fail dengan berkesan.

Atas ialah kandungan terperinci Bagaimana untuk Muat Turun Fail dalam Angular2 Menggunakan Observables dan Blobs?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!