Comment envoyer fichier téléchargé Excel pour C# API post en utilisant angulaire 4

Question

var fd = new FormData(); 
fd.append('file', data.target.files[0]); 
return this.http.post(url), fd).map().catch(); 

En utilisant AngularJS il fonctionne, mais pour 4 angulaire quand j'utilisé la même façon, il est pas working.I me fais erreur disque lors du téléchargement Excel file.Please aide-moi .

Answer 1

Dans le service

public importMassUpdateExcel(file: FormData, id): Observable<any> { const headers = new Headers({ 'Authorization': '',//authorization token 'Content-Type': 'application/json; charset=UTF-8'// }); const options = new RequestOptions({ headers: headers }); return this.http .post(url, file, options) .map() .catch(); }

Answer 2

Voici un exemple, que j'utilise pour télécharger des fichiers dans l'API via FormData.

Dans votre fichier de service comme upload.service.ts vous devez créer une fonction pour télécharger des fichiers via la méthode POST. Voici un exemple pour cette fonction:

getUploadHeaders() { 
    let headers = new Headers({'Accept': 'application/json'}); 
    headers.delete('Content-Type'); 
    return headers; 
}  

addNewPost(newPost: FormData): Observable<FormData> { 
    const endpoint = 'https://yourApiUrl.com'; 
    return this.http 
     .post(endpoint, newPost, { headers: this.getUploadHeaders() }) 
     .catch((e) => this.handleError(e)); 
} 

Et maintenant, vous devez créer la fonction de téléchargement dans votre composant, par exemple upload.component.ts. Voici un exemple de fonction de téléchargement avec FormData.

fileToUpload: File = null; 

constructor(private uploadService: UploadService) { } 

handleFileInput(files: FileList) { 
    this.fileToUpload = files.item(0); 
} 


saveFileToApi() { 
    const saveForm: FormData = new FormData();  
    if (this.fileToUpload) { 
    saveForm.append('fileFieldNameOnYourApi', this.fileToUpload, this.fileToUpload.name); 
    } 

    this.uploadService.addNewPost(saveForm).subscribe(() => { 
    console.log('Upload success!'); 
    }, error => { 
    console.log('Upload failed!'); 
    }); 
} 

Pour télécharger un fichier via FormData vous avez besoin 3 paramètres: propertyName sur critère d'évaluation de l'API, le fichier et le nom de ce fichier. Et dans votre upload.component.html vous devez avoir la forme comme celui-ci:

<form (ngSubmit)="onSubmit()">  
    <label for="fileField">Chose file to upload</label> 
    <input type="file" 
      id="fileField" 
      name="fileField" 
      (change)="handleFileInput($event.target.files)"> 
    <button type="submit">Speichern</button> 
</form> 

Pour plus de détails sur FormData lire this et pour lire plus d'informations sur FormData.append().