Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to upload the image on click canvas area instead of speared upload button #286

Open
dhanarajp opened this issue Jan 24, 2018 · 6 comments

Comments

@dhanarajp
Copy link

How to upload the image on click canvas area instead of speared upload button,

@dhanarajp
Copy link
Author

is it possible can bring in this plugin as per below image, i can able to onclick upload dialog opening but i stuck in drag and drop functionality.

image

@web-dave
Copy link
Collaborator

web-dave commented Feb 9, 2018

do you still need help?

@dhanarajp
Copy link
Author

yes, @web-dave

@web-dave
Copy link
Collaborator

web-dave commented Feb 9, 2018

how do you trigger the input dialog?

<input *ngIf="!settings.noFileInput" #fileInput type="file" accept="image/*" (change)="fileChangeListener($event)">

and in the onMouseDown

@ViewChild("fileInput") fileInput: ElementRef;

  public onMouseDown(event: MouseEvent): void {
    this.cropper.onMouseDown(event);
    if (!this.cropper.isImageSet() && !this.settings.noFileInput) {
      // load img
      this.fileInput.nativeElement.click();
    }
  }

@web-dave
Copy link
Collaborator

web-dave commented Feb 9, 2018

That's one way. but I'll test it tonight.

@dhanarajp
Copy link
Author

Hi @web-dave , i got error:
[ts] Property 'isImageSet' does not exist on type 'ImageCropperComponent'.

I am using
"ng2-img-cropper": "^0.8.6",

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants