我試圖使用 Angular 將影像上傳到谷歌存盤桶。Postman 一切正常。但我堅持使用角度打字稿。誰能向我建議一種方法來做到這一點?
.html 檔案
<input type="file" accept="image/png, image/jpeg" class="form-control upload-btn" formControlName="imageUpload" placeholder="Upload Images" (change)="uploadImage($event)" required>
.ts 檔案
uploadImage(event: any) {
if (event.target.files && event.target.files[0]) {
const uploadImage=event.target.files[0];
const fileObject = {
userId: this.userId,
bucketName: 'Test123',
image: uploadImage
};
this.userService.uploadImage(fileObject).subscribe(data=>{
},err=>{
console.log("error occured")
}
)
}
}
.service 檔案
uploadImage(fileObject: any){
return this.http.post('http://localhost:1337' 'upload-image' , fileObject);
}
后端沒有任何錯誤發生。它與Postman一起作業得很好。我不確定.ts檔案。
uj5u.com熱心網友回復:
正如@PrasenjeetSymon 所建議的,使用 FormData 將有助于在 Angular 中上傳影像。
這是演示如何使用 FormData的類似執行緒
您可以使用 HTML 中的標簽:
<input type="file" name="file" id="file" (change)="onFileChanged($event)" />在組件中:
public files: any[]; contructor() { this.files = []; } onFileChanged(event: any) { this.files = event.target.files; } onUpload() { const formData = new FormData(); for (const file of this.files) { formData.append(name, file, file.name); } this.http.post('url', formData).subscribe(x => ....); }
轉載請註明出處,本文鏈接:https://www.uj5u.com/net/464174.html
標籤:javascript 有角度的 打字稿 推特引导 谷歌云存储
