Image From Gallery Not Displaying On Img Tag In Ionic 2

I am trying to display image from gallery to img tag. But image not showing on img tag. But it is working with PhotoViewer . below is my code. options: CameraOptions = { quali

Solution 1:

Hi have the same problem in ios, I resolve this problem by doing the following step

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 imagethis.photos.reverse();
            }

Html section

<ion-row><ion-colcol-3 *ngFor="let photo of photos; let id = index"><ion-cardclass="block"><ion-iconname="ios-close-circle-outline"class="deleteIcon" (click)="deletePhoto(id)"></ion-icon><img [src]="photo" *ngIf="photo" /></ion-card></ion-col></ion-row>