Это файл Home.ts, в котором закодирована функция takephoto()
, я импортировал параметры камеры и камеры из ionic-native / camera, как показано ниже:
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { Camera, CameraOptions } from '@ionic-native/camera';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
myphoto: any;
constructor(public navCtrl: NavController, private camera:Camera) {
}
takePhoto(){
const options: CameraOptions = {
quality: 70,
destinationType: this.camera.DestinationType.FILE_URI,
encodingType: this.camera.EncodingType.JPEG,
mediaType: this.camera.MediaType.PICTURE
}
this.camera.getPicture(options).then((imageData) => {
// imageData is either a base64 encoded string or a file URI
// If it's base64 (DATA_URL):
this.myphoto = 'data:image/jpeg;base64,' + imageData;
}, (err) => {
// Handle error
});
}
}
, и это мой Home.html file:
<ion-header>
<ion-navbar>
<ion-title>
Ionic Blank
</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
The world is your oyster.
<p>
If you get lost, the <a href="http://ionicframework.com/docs/v2">docs</a> will be your guide.
</p>
<button ion-button (click)="takePhoto()"> Take Photo </button>
<p align ="center"><img src="{{ myphoto }}"></p>
</ion-content>
После того, как я щелкну изображение на моем устройстве Android, оно не покажет конечный результат на home.html. Может кто-нибудь сказать, в чем причина этой проблемы?.
Я прилагаю скриншоты внизу: Это изображение, которое я сделал после нажатия кнопки «Сделать фото»
Как вы можете видеть через это изображениечто окончательное изображение не отображается на странице