Quantcast
Channel: Ionic Forum - Latest posts
Viewing all articles
Browse latest Browse all 229612

Upload image in div element

$
0
0

Hello friends when i try to upload a image in a div element from the camera image is uploading but it is not displaying in the div element..ie.., an empty background is displaying.. i need help from you guys to find this error..I am using cordova-plugin-camera to get camera and library images from the phone

my html code is

 <div text-center class="photo-grid">
   <img src="{{pathForImage(lastImage)}}" style="width:100%;display:block;" [hidden]="lastImage === null"/>
    <h3 [hidden]="lastImage !== null">Please Select an Image!</h3>
 </div>

and my .ts file code is

var options = {    quality: 100,
   sourceType: sourceType,
 saveToPhotoAlbum: false,
    correctOrientation: true
};

this.camera.getPicture(options).then((imagePath) => {
 // Special handling for Android library
 if (this.platform.is('android') && sourceType === this.camera.PictureSourceType.PHOTOLIBRARY) {
    this.filePath.resolveNativePath(imagePath)
      .then(filePath => {
         let correctPath = filePath.substr(0, filePath.lastIndexOf('/') + 1);
         let currentName = imagePath.substring(imagePath.lastIndexOf('/') + 1,imagePath.length,imagePath.lastIndexOf('?').shift());          this.copyFileToLocalDir(correctPath, currentName, this.createFileName());        });        } else {      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 copyFileToLocalDir(namePath, currentName, newFileName) {
 this.file.copyFile(namePath, currentName, this.file.externalApplicationStorageDirectory, newFileName).then(success => {
  this.lastImage = newFileName;
  this.pathForImage(this.lastImage);
  }, error => {
  this.presentToast('Error while storing file.');
});
}
public pathForImage(img) {
 if (img === null) {
   return '';
} else {
    return this.file.externalApplicationStorageDirectory + img;
   }
}

Viewing all articles
Browse latest Browse all 229612

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>