How to receive multiple images in Web Api from Angular 4 application

Question

I am new to Angular 4 and Web API ,Here I am trying to upload multiple images from Angular 4 application to Web API .

In this case I have successfully received images in API ,While I debugging the API I could see the count of the uploaded Images.

But When I trying to save the image in folder only one images is stored .And in database all the image path is showing the same path .

When I debugging the API in the foreach loop all the images showing the same Image Name .

service.ts[Angular 4]

 ImageInsert(mObject, mImage) {
        const formData: FormData = new FormData();
        formData.append('mFormData', JSON.stringify(mObject));
        for (const file of mImage) {
          formData.append('ImageFile', file, file.name);
        }
        return this.http.post(this.BASE_URL + `/api/ImageInsert`, formData)
      }

can anyone help me to solve this .

Answer 1

I found that I have did the mistake in service file .

ImageInsert(mObject, mImage) {
        const formData: FormData = new FormData();
        formData.append('mFormData', JSON.stringify(mObject));
        for (const file of mImage) {
          formData.append('ImageFile'+file.name, file, file.name); //Need to have unique key name for each formData
        }
        return this.http.post(this.BASE_URL + `/api/ImageInsert`, formData)
      }