Angular2에서 파일을 다운로드하는 방법은 무엇입니까?

Angular2에서 파일 다운로드

Angular2를 사용하여 파일 다운로드를 구현하는 데 어려움을 겪고 있습니다. 특히 수신된 데이터를 저장하는 방법과 파일 저장 기능을 실행하는 방법을 이해할 수 없습니다. Angular에서 이것이 어떻게 달성될 수 있는지 살펴보겠습니다.

문제

코드의 주요 문제는 파일을 다운로드하는 데 사용되는 관찰 가능 항목이 별도의 컨텍스트에서 실행된다는 것입니다. . 이로 인해 window.URL.createObjectURL을 사용하여 URL 변수를 생성하려고 하면 빈 개체가 생성됩니다. 이 문제를 해결하려면 objectURL이 올바른 컨텍스트 내에서 구성되었는지 확인해야 합니다.

해결책

이 문제에 대한 효과적인 해결책 중 하나는 관찰 가능하고 파일 다운로드를 처리하는 별도의 함수에 데이터를 전달합니다. 이는 다음 코드를 사용하여 수행할 수 있습니다.

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

downloadFile 함수는 다음과 같이 정의됩니다.

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

이 함수에서는 응답 데이터로 blob 객체를 생성하고 다음을 지정합니다. 파일 유형. 그런 다음 objectURL을 생성하고 새 창을 열어 파일을 다운로드합니다.

추가 고려 사항

'rxjs/Rx' 모듈을 가져왔는지 확인하는 것이 중요합니다. 바르게. '구독'과 같은 관찰 가능한 기능을 사용하려면 구성 요소 상단에 다음 줄을 포함해야 할 수도 있습니다.

import 'rxjs/Rx';

결론

By Observable을 구독하고 objectURL을 생성하는 전용 함수에 데이터를 전달하면 Angular2 이상에서 파일을 성공적으로 다운로드할 수 있습니다. 이 방법을 사용하면 다운로드 프로세스를 더 효과적으로 제어하고 올바른 컨텍스트 내에서 데이터를 처리할 수 있습니다.

위 내용은 Angular2에서 파일을 다운로드하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!