[英]Image from gallery not displaying on img tag in ionic 2
我正在嘗試顯示從圖庫到img
標簽的圖像。 但是圖像未顯示在img
標簽上。 但是它正在與PhotoViewer
一起使用。 下面是我的代碼。
options: CameraOptions = {
quality: 100,
destinationType: this.camera.DestinationType.FILE_URI,
encodingType: this.camera.EncodingType.JPEG,
sourceType: this.camera.PictureSourceType.PHOTOLIBRARY
//mediaType: this.camera.MediaType.PICTURE
}
用拍攝的圖像
this.camera.getPicture(this.options).then((imageData) => {
alert(imageData)
this.photoViewer.show(imageData);
this.captureDataUrl=imageData;
}, (err) => {
// Handle error
});
在HTML中
<img [src]="captureDataUrl" *ngIf="captureDataUrl"/>
如果我將sourceType用作相機( sourceType: this.camera.PictureSourceType.CAMERA
),它也可以工作,它將在img標簽上顯示圖像,但是如果我將sourceType用作sourceType: this.camera.PictureSourceType.PHOTOLIBRARY
,則無法正常工作。 請幫忙
您好在ios中有相同的問題,我可以通過執行以下步驟來解決此問題
var options = {
quality: 80,
allowEdit: true,
sourceType: this.camera.PictureSourceType.CAMERA,
saveToPhotoAlbum: false,
correctOrientation: true,
encodingType: this.camera.EncodingType.JPEG,
destinationType: this.camera.DestinationType.FILE_URI
//encodingType: this.camera.EncodingType.PNG,
};
this.camera.getPicture(options).then((imagePath) => {
// Special handling for Android library //
if (this.platform.is('ios')) {
this.ImageData = imagePath.replace(/^file:\/\//, '');
}
else {
this.ImageData = imagePath;
}
this.photos.push(this.ImageData); //if you have to show multiple image
this.photos.reverse();
}
HTML部分
<ion-row>
<ion-col col-3 *ngFor="let photo of photos; let id = index">
<ion-card class="block">
<ion-icon name="ios-close-circle-outline" class="deleteIcon" (click)="deletePhoto(id)"></ion-icon>
<img [src]="photo" *ngIf="photo" />
</ion-card>
</ion-col>
</ion-row>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.