FileSaver et Angular2 - ne trouve pas le fichier sur get request

J'essaie de faire fonctionner FileSaver pour mon projet Angular2 et j'ai essayé de travailler avec les réponses des autres questions et je n'arrive toujours pas à le trouver.FileSaver et Angular2 - ne trouve pas le fichier sur get request

Dans mon service:

@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())); 
    } 

}

Dans mon composant:

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'); 
     }

Dans mon html:

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

Et je reçois cette erreur:

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)

Je ne sais pas si je ne crée pas l'URL correcte pour le dossier des actifs ou quoi, mais j'ai essayé de nombreuses versions de celui-ci et toujours obtenir la même erreur. Toute aide serait très appréciée. Je vous remercie.

Source

2017-09-12 SasquatchShawn

Le problème n'est probablement pas dans FileSaver. Vous écrivez:

private _http: Http

Mais vous utilisez sans _:

this.http should be this._http

Source

2017-09-12 18:21:17 alexKhymenko

Cela a fonctionné avec altérant mon actionUrl légèrement. Merci! Je n'ai pas assez de réputation pour remettre cela en question, mais je le ferais si je le pouvais. – SasquatchShawn

@SasquatchShawn Vous pouvez accepter la réponse. Merci :-) – alexKhymenko

Merci encore @alexKhymenko! J'utilise SO constamment, mais généralement je peux trouver des réponses sans poster mes propres questions. Très appréciée! – SasquatchShawn

peut vous changer de méthode downloadBlaBlasCSV

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' }) 
    }) 
    }

voir également ce post angular2 file download

Source

2017-09-12 18:28:00 Robert

FileSaver et Angular2 - ne trouve pas le fichier sur get request

Répondre

Questions connexes