Photo

Photo

Photo

takePhoto() {
    const options: CameraOptions = {
      quality: 50,
      destinationType: this.camera.DestinationType.DATA_URL,
      encodingType: this.camera.EncodingType.JPEG,
      mediaType: this.camera.MediaType.PICTURE,
    }

    this.camera.getPicture(options).then((imageData) => {
      let base64Image = 'data:image/jpeg;base64,' + imageData;
      let photo = new Photo();
      let id = random(1, 12);
      photo.id = id;
      photo.url = base64Image;
      if (this.data == null) this.data = [];
      this.data.push(photo);
    }, (err) => {
      // Handle error
    });
  }

 .photo {
        position: relative;
        width: 100%;
        height: 200px;
        overflow: hidden;
        img {
            position: absolute;
            left: 50%;
            top: 50%;
            height: 100%;
            width: auto;
            -webkit-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
        }
        img.portrait {
            width: 100%;
            height: auto;
          }
    }

<div class="photo">
   <img [src]="url" class="portrait">
</div>