Как отправить несколько изображений в формате formdata в Angular 4 - PullRequest
Новая
       13

Как отправить несколько изображений в формате formdata в Angular 4

0 голосов
/ 16 мая 2019

Я хочу отправить несколько изображений в формате formdata, пока я отправлял одно изображение в формате base65, но здесь я должен отправить не более 5 изображений в формате formdata.

Я пытаюсь решить эту проблему, но не могу ее достичь.

Мои коды выглядят как показано ниже .ts 

    handleFiles= function (fileInput: Event) {

         if (fileInput.target['files'].length>1) {

            var files = Array.from(fileInput.target['files']);
    this.authService.sendMultipalImages(files).subscribe(data=>{
        console.log(data);

    })

            }else{
                var files = Array.from(fileInput.target['files']);


                this.convertImageToBase64(files, []);
            }


                }


            convertImageToBase64(list, resultArray) {

              if(list.length){
                let reader = new FileReader();
                reader.readAsBinaryString(list[0]);
                reader.onload = (evt: any) => {

                  const str = btoa(evt.target.result)
                  resultArray.push('data:image/jpeg;base64,' + str);
                  list.splice(0, 1);
                  console.log(list.length)
                  return this.convertImageToBase64(list, resultArray);
                };  
              } else {


                console.log(resultArray.length);

                    this.attached_image = resultArray[0];

                }

это мой сервис .ts файл 

sendMultipalImages = function(mImage){

      let formData: FormData = new FormData();

       formData.append('image', mImage);


        return this.http.post(this.api_url + 'uploadmultiple', formData, this.getUploadMulitpleImages()).map(res => res.json())
      }



header looks like this


getUploadMulitpleImages() {

            let headers = new Headers();
            headers.append('Content-Type', 'multipart/form-data');
           headers.append('Accept', 'application/json');
           headers.set('Authorization', 'Bearer ' + this.webToken);
          let option = new RequestOptions({ headers: headers });
       return option;
         }

Пожалуйста, как я могу отправить несколько изображений на сервер. Ваша помощь будет высоко оценена. Заранее спасибо

1 Ответ

0 голосов
/ 17 мая 2019

Я нашел ответ.Просто я удалил эти вещи из заголовка, не вносил никаких изменений в файл компонента, 

 headers.append('Content-Type', 'multipart/form-data');
  headers.set('Authorization', 'Bearer ' + this.webToken);// this is optional

Service.ts 

sendMultipalImages = function(mImage){
       debugger;
       var formData: FormData = new FormData();
       for (const file of mImage) {
        formData.append(file.name, file)

      }
    return this.http.post(this.api_url + 'uploadmultiple', formData, this.getUploadMulitpleImages()).map(res => res.json())
      }
...