1.多個(gè)圖片上傳
$ ionic cordova plugin add cordova-plugin-camera
$ npm install --save @ionic-native/camera
導(dǎo)入模塊:import { Camera, CameraOptions } from '@ionic-native/camera';
app.module.ts中引入模塊;
事件執(zhí)行:
addImg() {
if (this.imagePaths.length == 3) {
let tipLoader = this.loadingCtrl.create({
content: "最多添加3張!",
spinner: 'hide',
duration: 800,
showBackdrop: true
});
tipLoader.present();
return;
}
let actionSheet = this.actionsheetCtrl.create({
cssClass: 'action-sheets-basic-page',
buttons: [
{
text: '拍照',
handler: () => {
this.takePhoto();
}
},
{
text: '從手機(jī)相冊(cè)選擇',
handler: () => {
this.choosePhoto();
}
},
{
text: '取消',
role: 'cancel',
handler: () => {
console.log('取消選擇圖片');
}
}
]
});
actionSheet.present();
};
takePhoto() {
var options = {
// Some common settings are 20, 50, and 100
quality: 50,
destinationType: this.camera.DestinationType.FILE_URI,
// In this app, dynamically set the picture source, Camera or photo gallery
width:50,
height:50,
encodingType: this.camera.EncodingType.JPEG,
mediaType: this.camera.MediaType.PICTURE,
saveToPhotoAlbum:true,
sourceType:this.camera.PictureSourceType.CAMERA,//拍照時(shí),此參數(shù)必須有,否則拍照之后報(bào)錯(cuò),照片不能保存
correctOrientation: true? //Corrects Android orientation quirks
}
/**
* imageData就是照片的路徑,關(guān)于這個(gè)imageData還有一些細(xì)微的用法,可以參考官方的文檔。
*/
this.camera.getPicture(options).then((imageData) => {
// imageData is either a base64 encoded string or a file URI
// If it's base64:
let base64Image =? imageData;
// this.path = base64Image;//給全局的文件路徑賦值。
this.imagePaths.push(base64Image);
/*? this.zone.run(() => this.image = base64Image);*/
}, (err) => {
// Handle error,出錯(cuò)后,在此打印出錯(cuò)的信息。
alert( err.toString());
});
}
choosePhoto() {
var options: CameraOptions = {
// Some common settings are 20, 50, and 100
quality: 50,
destinationType: this.camera.DestinationType.FILE_URI,
// In this app, dynamically set the picture source, Camera or photo gallery
sourceType:0,//0對(duì)應(yīng)的值為PHOTOLIBRARY ,即打開(kāi)相冊(cè)
encodingType: this.camera.EncodingType.JPEG,
mediaType: this.camera.MediaType.PICTURE,
allowEdit: true,
correctOrientation: true? //Corrects Android orientation quirks
}
this.camera.getPicture(options).then((imageData) => {
let base64Image =? imageData;
this.imagePaths.push(base64Image);
}, (err) => {
});
}