how to upload a file in angular along with a string using formData for the file

Question

I have successfully made the post request but in the request body the formData is empty. i don't know what might be the cause

  trigger() {
    let element = document.getElementById('upload_file') as HTMLInputElement;
    element.click();
  }


  onChange(file: any) {
    this.FILE = file.files[0];
    this.fileName = file.files[0].name;
  }

 uploadDocument() {
  this.document = new Document();
  this.document.value= this.VALUE;
  .
  .
  .
  this.document.value= this.VALUE;

  let document = JSON.stringify(this.document);
  const formData: FormData = new FormData();
  formData.append('file', this.FILE, this.FILE.name);

      return this.http.post(this.baseURL + '/rest/document/', {document, formData}).subscribe((data: any) => {
      this.connection.creating = false;
    })
  }

Does this answer your question? [Angular File Upload](https://stackoverflow.com/questions/47936183/angular-file-upload) — Munzer, Sep 21 '21 at 16:14

score 0 · Accepted Answer · answered Sep 21 '21 at 20:48

set your document field as a part of FormData

  let document = JSON.stringify(this.document);
  const formData: FormData = new FormData();
  formData.append('file', this.FILE, this.FILE.name);
  formData.append('document', document);

  return this.http.post(this.baseURL + '/rest/document/', formData).subscribe((data: any) => {
      this.connection.creating = false;
    })
  }

how to upload a file in angular along with a string using formData for the file

1 Answers1