2017-02-14 93 views
0

圖片上傳問題:圖片上傳問題:在角2

我們與上傳圖片到MySQL爲「二進制大對象數據」採用了棱角分明2.我們不知道如何解析圖像轉換成團塊的問題數據

image.html:

<input type="file" class="fileinput btn-primary" name="file" id="file" formControlName="file" 
         title="Browse image" [(ngModel)]="student.file" (change)="onChange($event)" /> 

image.component.ts:

  file: File; 
      onChange(event: EventTarget) { 
      let eventObj: MSInputMethodContext = <MSInputMethodContext> event; 
      let target: HTMLInputElement = <HTMLInputElement> eventObj.target; 
      let files: FileList = target.files; 
      this.file = files[0]; 
      console.log(this.file); 

以JSON

Student(
    name: string, 
    class:string, 
    file: any, 
    rollNo: number): Observable<any> { 
    let requestData = { 
     name: name, 
     class: class, 
     photo: { 
      data: file, 
      contentType: "multipart/form-data" 
     }, 
     rollNo: rollNo, 
    }; 
    return this.http.post(this.studentUrl, requestData) 
     .map(response => { 
      return response; 
     }); 
} 

當我們運行這段代碼它顯示了以下錯誤。

異常

"Caused by: org.hibernate.TransientPropertyValueException: object references an unsaved transient instance - save the transient instance before flushing 

如果這方面的任何插件或指令?

回答

0

我用下面的代碼來解決類似的問題

這是COMPONENTNAME.component.html

我的文件元素
<input type="file" (change)="fileChange($event)"> 

創建fileChange功能,以您的COMPONENT.component.ts

private fileChange(event: any) { 
    let reader = new FileReader(); 
    let imageBlob: any; 
    reader.onload = (fileReadEvent: any) => { 
     imageBlob = fileReadEvent.target.result; 
    }; 
    reader.readAsDataURL(event.target.files[0]); 
} 

當你上傳圖片時,它會調用fileChange方法並且readAsDataURL方法會被觸發,而imageBlob變量將會以blob的形式顯示圖片。

希望這會解決您的問題!