2017-09-12 1 views
0

내 Angular2 프로젝트에서 FileSaver를 작동시키고 다른 질문의 답변을 시도했지만 여전히 찾을 수 없습니다.FileSaver 및 Angular2 - 가져 오기 요청시 파일을 찾을 수 없음

import { saveAs } from 'file-saver'; 

    downloadBlaBlasCSV() { 
     this._downloadsService.downloadBlaBlasCSV().subscribe(
      (data) => { this.openFileForDownload(data); }, 
      (error: any) => {}); 
     } 

    openFileForDownload(data: Response) { 
     var blob = new Blob([data], { type: 'text/xlsx;charset=utf-8' }); 
     saveAs(blob, 'player_template.xlsx'); 
     } 
내 HTML에서

: 내 구성 요소에서

@Injectable() 
export class DownloadsService { 
    http: any; 
    private actionUrl: string; 
    //constructor(private _http: Http) { 
    constructor(private jsonp: Jsonp, private _http: Http) { 
     let hostname = document.location.hostname; 
     console.log(hostname); 
     if (hostname === 'localhost') { 
      this.actionUrl = '/src/assets/rr/spreadsheets/'; 
     } else { 
      this.actionUrl = ''; 
     } 
    } 

    downloadBlaBlasCSV() { 
     let options = { responseType: ResponseContentType.ArrayBuffer }; 
     console.log(this.actionUrl + 'event_template_2.xlsx'); 
     return this.http 
      .get(this.actionUrl + 'event_template_2.xlsx', options) 
     .map((res: Response) => res['_body']) 
     .catch((err: Response) => Observable.throw(err.json())); 
    } 

} 

: 내 서비스에서

ERROR TypeError: Cannot read property 'get' of undefined 
    at DownloadsService.webpackJsonp.../../../../../src/app/services/downloads.service.ts.DownloadsService.downloadBlaBlasCSV (downloads.service.ts:32) 
    at PlayersComponent.webpackJsonp.../../../../../src/app/players/players.component.ts.PlayersComponent.downloadBlaBlasCSV (players.component.ts:27) 
    at Object.eval [as handleEvent] (PlayersComponent.html:37) 
    at handleEvent (core.es5.js:11995) 
    at callWithDebugContext (core.es5.js:13456) 
    at Object.debugHandleEvent [as handleEvent] (core.es5.js:13044) 
    at dispatchEvent (core.es5.js:8599) 
    at core.es5.js:9210 
    at HTMLButtonElement.<anonymous> (platform-browser.es5.js:2651) 
    at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:424) 
:

<button class="btn btn-primary" (click)="downloadBlaBlasCSV()">Download Spreadsheet Template</button> 

그리고이 오류가 나타납니다

assets 폴더 또는 무엇에 대한 정확한 URL을 만들지는 모르겠지만 많은 반복을 시도했지만 여전히 동일한 오류가 발생합니다. 어떤 도움이라도 대단히 감사 할 것입니다. 고맙습니다.

답변

0

문제는 아마도 FileSaver에 없습니다.

private _http: Http 

하지만 _없이 사용하고 있습니다 : 당신이 작성하는

this.http should be this._http 
+0

이 게시물을 참조 내 actionUrl 약간. 감사! 나는 이것에 upvote에 충분한 명성이 없지만, 만약 내가 할 수 있다면. – SasquatchShawn

+0

@SasquatchShawn 답변을 수락 할 수 있습니다. 감사합니다 :-) – alexKhymenko

+0

다시 한번 감사드립니다 @alexKhymenko! 나는 끊임없이 그것을 사용하지만, 보통 나는 내 자신의 질문을 게시하지 않고 해답을 찾을 수 있습니다. 매우 감사! – SasquatchShawn

0

당신이 방법을

downloadBlaBlasCSV() 
{  
    let headers = new Headers(); 
    headers.append('Authorization', 'JWT ' + localStorage.getItem('id_token')); 
    return this._http.get(url,{ headers: headers,responseType: ResponseContentType.Blob }).map(
    (res) => { 
     return new Blob([res.blob()], { type: 'application/vnd.ms-excel' }) 
    }) 
    } 

을 downloadBlaBlasCSV 변경할 수 있습니다 또한이 변질과 함께 일 angular2 file download

관련 문제