Question

我有一个允许用户上传多个文件的表格。用户可以为每个文件添加描述。我创建了一个包含文件及其描述的接口。 FormData的问题是您不能追加对象，只能追加字符串或Blob。因此，我必须将文件及其描述分别附加到FormData上，并在后端（Java）中单独检索它，这不好。我尝试扩展现有接口Blob并添加描述字段，但操作失败。有谁有更好的解决方案？谢谢

HTML

<label class="custom-file-upload">
                <input type="file" placeholder="Upload Files" id="file" name="files" (change)="uploadFile($event)"
                  multiple="multiple" accept="*" />
                Upload Documents<mat-icon class="uploadIcon">arrow_upward</mat-icon>
              </label>

TS

export interface IncidentFile {
    file?: any;
    description?: string;
}

incidentFiles: IncidentFile[] = [];

uploadFile(event: any) {
    Array.from(event.target.files).forEach(file => {
      this.incidentFiles.push({
        file: file,
        description: 'test',
      });
    });
  }

在提交方法中：

 if (this.incidentFiles.length > 0) {
      for (let i = 0; i < this.incidentFiles.length; i++) {
        this.formData.append('files', this.incidentFiles[i].file);
        this.formData.append('fileDescription', this.incidentFiles[i].description);
      }
    }

Angular 6-使用FormData

0 个答案: