I have a problem with replacing an image.
I have a component in wich on button click I pick image to input in cropper. But, if I choose to repick it cropper sets out two images in cropper. Im using cropper.replace, but its doesnt change anything.
`
@ViewChild('cropperObj', { static: false }) public cropperObj: CropperComponent;
imageSelected: boolean = false;
imgURL: any = 'img/user_none.svg';
croppedImg: string;
onFileSelect(e) {
let files = e.target.files;
var mimeType = files[0].type;
if (mimeType.match(/image\/*/) == null) {
alert("Only images are supported.");
return;
}
let reader = new FileReader();
reader.readAsDataURL(files[0]);
reader.onloadend = (_event) => {
console.log(this.cropperObj.cropper);
this.croppedImg = "" + reader.result
this.cropperObj.cropper.replace(this.croppedImg);
}
this.imageSelected = true;
}`
nishantniket
commented
4 years ago
I have a problem with replacing an image. I have a component in wich on button click I pick image to input in cropper. But, if I choose to repick it cropper sets out two images in cropper. Im using cropper.replace, but its doesnt change anything.
imageSelected: boolean = false; imgURL: any = 'img/user_none.svg'; croppedImg: string;
onFileSelect(e) { let files = e.target.files; var mimeType = files[0].type; if (mimeType.match(/image\/*/) == null) { alert("Only images are supported."); return; } let reader = new FileReader(); reader.readAsDataURL(files[0]); reader.onloadend = (_event) => { console.log(this.cropperObj.cropper); this.croppedImg = "" + reader.result this.cropperObj.cropper.replace(this.croppedImg); } this.imageSelected = true; }`