如何使用 Angular 将上传的 excel 文件发送到 C# Post API 4

Question

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

使用 AngularJS 它可以工作但是对于 angular 4 当我使用相同的方式时它不是 working.I 我在上传时遇到磁盘错误 excel file.Please帮帮我。

Answer 1

这是一个示例，我用它通过 FormData 将文件上传到 API。

在像 upload.service.ts 这样的服务文件中，您需要创建通过 POST 方法上传文件的函数。这是此函数的示例：

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

现在您应该在组件中创建上传功能，例如 upload.component.ts。这是使用 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!');
  });
}

要通过 FormData 上传文件，您需要 3 个参数：API 端点上的属性名称、文件和此文件的名称。在你的 upload.component.html 中你需要有这样的形式：

<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>

有关 FormData 的更多详细信息，请阅读 this and for more information about FormData.append() read this。

Answer 2

服役中

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

如何使用 Angular 将上传的 excel 文件发送到 C# Post API 4

How to send uploaded excel file to C# Post API using Angular 4

c#-4.0

epplus-4

angular