Angular 6 post-request with a multipart form doesn't include the attached file of the object posted

Your POST request body is actually JSON, not Multipart as you would hope (despite what the Content-Type header says).

In order to remedy that, you need to build a FormData object, and use that in your request instead:

let input = new FormData();
// Add your values in here
input.append('id', invoice.id);
input.append('invoiceFile', invoice.invoiceFile);
// etc, etc

this.http.post('/api/v1/invoices/', input, HttpUploadOptions)

Remove the multipart/form-data from the headers to fix this issue

const HttpUploadOptions = {
  headers: new HttpHeaders({ "Content-Type": "multipart/form-data" })
}

Solution

const HttpUploadOptions = {
  headers: new HttpHeaders({ "Accept": "application/json" })
}

I had previously this one which was giving error

const formData = new FormData();
formData.append(...);
this.http.post(apiUrl, {formData});

I just removed the object from braces and it worked

this.http.post(apiUrl, formData);