Appending data to FormData in angular

Question

I have a file that i wants to append it properties to formData before sending it to the server for upload but can't seem to appending. here is the code

uploadFile() {
let data = new FormData();
data.append('image', this.file, this.file.name);
console.log(data);
}

am getting an empty object in the console even though the file variable has the file data. is the anything am missing?

Maybe this answer will help you: https://stackoverflow.com/questions/47936183/angular-file-upload/47938117#47938117 — Gregor Doroschenko, Dec 12 '18 at 12:27
Hi, try to give **console.log(data.get('image'))**, let me know if it works — Pavan Skipo, Dec 12 '18 at 12:35
this is what i got:File(4659) lastModified: 1530958011139 lastModifiedDate: Sat Jul 07 2018 11:06:51 GMT+0100 (West Africa Standard Time) {} name: "17334146_982301731873467_6292546217318547456_a-1.jpg" size: 4659 type: "image/jpeg" webkitRelativePath: "" __proto__: File — yaxx, Dec 12 '18 at 12:42
FormData is not a simple object so it doesn't mean that it's not append. Check what you send to the server in Network DevTools. — Gilsdav, Dec 12 '18 at 13:46

score 0 · Answer 1 · answered Dec 12 '18 at 17:07

try this:

<input type="file" (change)="fileService.uploadPhoto(file.files)">

and in your fileService:

uploadPhoto(files) {

    if (files.length > 0) {
        const formData = new FormData();
        for (let file of files)
            formData.append(file.name, file);
        .
        .
        .
    }
}

Appending data to FormData in angular

1 Answers1