We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Overwrite the save method in image editor component


I want to use the image editor component for saving edited images to my backend. Can i overwrite the save method, so it doesn't download the image locally to the client.

One idea was to use the beforeSaved Event and overwrite the default behaviour, but it seems a bit hacky.

Another idea was the following, but it doesn't work

const imageEditor: ImageEditorComponent = getComponent(document.getElementById('image-editor')!, 'image-editor');

save(args: any): void {
// Custom save logic goes here
console.warn('Custom save function called!');

1 Reply

YA YuvanShankar Arunagiri Syncfusion Team December 6, 2022 10:06 AM UTC

Hi Simon,

We have prepared the sample based on your requirement. You can refer to the below code snippet and sample link. Using the beforeSave event, we can prevent the default save action of the image editor by using the below code.

API link: https://ej2.syncfusion.com/angular/documentation/api/image-editor/#beforesave

beforeSave(args) {

    args.cancel = true;

    // Custom save logic goes here

    console.warn('Custom save function called!');


Sample link: https://stackblitz.com/edit/angular-o6vlxg-ts2uy4?file=app.component.ts


YuvanShankar A

Live Chat Icon For mobile
Up arrow icon