如何在离子3中将图像转换为字符串数据

时间:2017-11-16 09:31:47

标签: typescript ionic-framework

目前我正在开发Ionic3项目。 现在我尝试将图像数据从UI存储到sqlite。 但我不确定这样做的适当方法。 如果你已经完成了,请帮助我 我怎么能这样做?

1 个答案:

答案 0 :(得分:0)

首先,你需要学习如何拍照,为此你应该参考这个链接。 https://devdactic.com/ionic-2-images/

之后图像进入图像的路径就像这个file:///image_path,所以你必须将这条路径传递给这样的base64插件。

为此你必须安装插件。

$ ionic cordova plugin add com-badrit-base64 $ npm install --save @ionic-native/base64

    public presentActionSheet() {
    let actionSheet = this.actionSheetCtrl.create({
    title: 'Select Image Source',
    buttons: [
    {
      text: 'Load from Library',
      handler: () => {
        this.takePicture(this.camera.PictureSourceType.PHOTOLIBRARY);
    }
    },
    {
      text: 'Use Camera',
      handler: () => {
        this.takePicture(this.camera.PictureSourceType.CAMERA);
      }
    },
    {
      text: 'Cancel',
      role: 'cancel'
    }
    ] 
    });
    actionSheet.present();
}

public takePicture(sourceType) {

    let resUser: string = "res.users";

    // Create options for the Camera Dialog
    var options = {
        quality: 100,
        sourceType: sourceType,
        saveToPhotoAlbum: true,
        correctOrientation: true
    };

    // Get the data of an image
    this.camera.getPicture(options).then((imagePath) => {
    // Special handling for Android library

    if (this.platform.is('android') && sourceType === this.camera.PictureSourceType.PHOTOLIBRARY) {

    this.base64.encodeFile(imagePath).then((base64String: string) => {
      // console.log("-----base64String-----" + base64String);
      let imageSrc = base64String.split(",");
      console.log("---Splitted image string----" + imageSrc[1]);
      this.src = imageSrc[1]


      let args = {
        image: imageSrc[1]
      }

      this.odooRpc.updateRecord(resUser, this.data[0].id, args).then((res: any) => {
        console.log("----res of updation---" + res);
      }).catch((err: any) => {
        this.presentToast("There is some problem in uploading image")
      })

    })

    this.filePath.resolveNativePath(imagePath)
      .then(filePath => {
        let correctPath = filePath.substr(0, filePath.lastIndexOf('/') + 1);
        let currentName = imagePath.substring(imagePath.lastIndexOf('/') + 1, imagePath.lastIndexOf('?'));
        this.copyFileToLocalDir(correctPath, currentName, this.createFileName());
      });

    } else {

    this.base64.encodeFile(imagePath).then((base64String: string) => {
      // console.log("-----base64String-----" + base64String);
      let imageSrc = base64String.split(",");
      console.log("---Splitted image string----" + imageSrc[1]);
      this.src = imageSrc[1]

      let args = {
        image: imageSrc[1]
      }

      this.odooRpc.updateRecord(resUser, this.data[0].id, args).then((res: any) => {
        console.log("----res of updation---" + res);
      }).catch((err: any) => {
        this.presentToast("There is some problem in uploading image")
      })
    })

    console.log("-------inside else IMage Path------" + imagePath);

    var currentName = imagePath.substr(imagePath.lastIndexOf('/') + 1);
    var correctPath = imagePath.substr(0, imagePath.lastIndexOf('/') + 1);
    this.copyFileToLocalDir(correctPath, currentName, this.createFileName());
    }
    }, (err) => {
      this.presentToast('Error while selecting image.');
    });
    }

private createFileName() {
    var d = new Date(),
    n = d.getTime(),
    newFileName = n + ".jpg";
    return newFileName;
}

// Copy the image to a local folder
private copyFileToLocalDir(namePath, currentName, newFileName) {
    this.file.copyFile(namePath, currentName, cordova.file.dataDirectory, newFileName).then(success => {
    this.lastImage = newFileName;
    }, error => {
    this.presentToast('Error while storing file.');
    });
}