Image picker : Not showing picked images

Ionic Native
1

Hello! Im using the latest v4.8.0 of ionic. Today i tried to implement a simple image picker functionability. So i saw the docs and end up with the following code:

elegirFoto() {
    let opcion = {
      title: 'Selecciona una foto',
      message: 'Selecciona almenos una foto',
      maximumImagesCount: 1,
      outType: 0 // 0 te devuelve path , 1 te devuelve base64
    };

    this.picker.getPictures(opcion).then(results => {
      results.forEach(element => {
        this.file.resolveLocalFilesystemUrl(element  ).then(resultado => {
          this.path = resultado.toURL();
        });
        console.dir(element)
      });
    }, err => {
      console.dir("hay un error " + err)
    })
  }

  cerrarModal() {
    this.modal.dismiss();
  }

  hacerFotoCamera() {
    let opciones: CameraOptions = {
      quality: 100,
      destinationType: this.camera.DestinationType.FILE_URI,
      encodingType: this.camera.EncodingType.PNG,
      mediaType: this.camera.MediaType.PICTURE
    };

    this.camera.getPicture(opciones).then(url => {
      this.file.resolveLocalFilesystemUrl(url).then(resultado => {
        this.path = resultado.toURL();
      });
    }, err => {
      alert("Hubo un error " + err)
    })
  }

  redimensionarFoto() {
    let opcion = {
      quality: 100,
      targetHeight: 100,
      targetWidth: 100

    };

    this.crop.crop(this.path, opcion).then(newImgUrl => {
      this.file.resolveLocalFilesystemUrl(newImgUrl).then(resultado => {
        this.path = resultado.toURL();
      });
    }, err => {
      alert("Hay un error " + err)
    })
  }

and my template is

<ion-content padding>
  <p>File Location : {{path}}</p>

  <ion-button (click)="elegirFoto()">
    Gallery
  </ion-button>
  <ion-button (click)="hacerFotoCamera()">
    Camera
  </ion-button>
  <ion-img [src]="path"></ion-img>
  <ion-button (click)="redimensionarFoto()">
    Redimensionar
  </ion-button>
</ion-content>

Why they are not showing when i run the app on my android device? I shows the following ( only the path )

starter
Screenshot_2019-01-18-19-47-58-156_io.ionic.starter.png1080×2160 73.2 KB

2

Try swapping [src] with src. I’ve found that tends to be the solution when using a path like that.

3

And use it like src={{path}} ? i tried it right now, howver i found something new. When i click on my Crop button it loads the original picture on the crop mode ! and i can crop it without problem. Something im doing bad and im feeling is a newbie mistake