Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

327
Views
how can I send form data with image in angular?

I have created an application where I want to send user summited form data with an image uploaded by them, I am new to angular so i am quiet unware of this can any body please help me I have attached images of my code below

I am using an model for user summited data and formdata method to upload image how can i combine both

[enter image description here][1] this is my image where i am creating api, highlighted area is where image is going i also want to send user submited data [enter image description here][2] this is the pic of my model [enter image description here][3] this is the pic of my form

thanks in advance

      [1]: https://i.stack.imgur.com/CoIHE.png
      [2]: https://i.stack.imgur.com/19My3.png
      [3]: https://i.stack.imgur.com/4PIMe.png
about 4 years ago · Juan Pablo Isaza
2 answers
Answer question

0

In the code in image 1 that you had attached, kindly repeat the formdata.append("key", value); once again for appending your user model's data as well.

It would be something similar to this,

const formdata = new FormData();
formdata.append("userData", this.userData.value);
formdata.append("image", this.uploadedFile.value);
about 4 years ago · Juan Pablo Isaza Report

0

Below, an example to upload a file item. I'm using a FileList here, maybe you are too. Hopefully this help you.

endpoint: string = 'https://YOURAPI/upload/Pictures';

httpUploadPicture(file: FileList)
{
    const formData = new FormData();
    formData.append('yourotherdata', yourotherdata);
    if (file) formData.append('File', file[0], file[0].name);

    this.http.post(this.endpoint, formData);
}
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!