각도 4 이미지 업로드

Question

HTTP POST API를 통해 이미지를 업로드하고 싶습니다. 내 의견은 이렇습니다.

<input type="file" (change)="changedata($event)" name="file"/> 

및 Changedata() 기능.

let fileList: FileList = event.target.files; 
    if (fileList.length > 0) { 
    let file: File = fileList[0]; 
    let formData: FormData = new FormData(); 
    formData.append('File', file, file.name); 
    this.mainservice.updateIcon(formData).subscribe(responseData=>{ 
      console.log(' Reposnce Data ',responseData)     
     }) 
    } 

내가 요청 페이로드는 보내지 이미지를 확인 .. 내가 base64로 이미지를 보낼 수있는 방법 https://www.screencast.com/t/vKFKj0S3
를 참조?

Answer 1

<input id="profile" type="file" name="profile" required (change)="uploadImage()"> 

및 UploadFile로의

public uploadImage(): void { 
    let files = this.element.nativeElement.querySelector('#profile').files; 
    let formData = new FormData(); 
    let file = files[0]; 
    formData.append('userID', this.userID); // if you want pass other value 
    formData.append('profile', file, file.name); // add image in FormData 
    // pass image to service 
    this.fileUpload.uploadFile(formData).subscribe(res => res); 
} 

Uploadimage 기능 - >> 서비스

public uploadFile(formdata: any) { 

     return this.http.post('ApiURL here', formdata).catch(this.errorHandler); 
     // return this.apiUrl; 
    } 

private errorHandler(error: Response) { 
     console.error('Error Occured: ' + error); 
     return Observable.throw(error || 'Some Error on Server Occured'); 
    }