Wait for img load to complete about angular2-img-cropper HOT 7 CLOSED

I'm still having issues in firefox 50.1.0. The image doesn't get loaded the first time I select an image but every subsequent time it works fine. I tried both noFileInput false and true.
Works in Chrome.

ng2-img-cropper 0.7.6
angular 2.2.3

from angular2-img-cropper.

@CamusAran
How can I detect image load is success on frontend side?

from angular2-img-cropper.

You can easily repro this in Safari where out of band parameters are passed to ctx.getImageData()

from angular2-img-cropper.

Works for me @frankfarzan!

from angular2-img-cropper.

I can reproduce it only on Firefox ... Investigating now

from angular2-img-cropper.

The issue was fixed - I was able to reproduce it rarely on my computer but I noticed that the loadend event was fired before image was loaded. Fixed it using a setInterval and checked if nativeHeight > 0. Will be released on 0.6

from angular2-img-cropper.

@CamusAran Had the same problem solved , in imageCropperComponent.ts
`

  public setImage(image: HTMLImageElement) {
     let self = this;
        this.intervalRef = window.setInterval(function() {
         //if (self.intervalRef) {clearInterval(self.intervalRef);}   <- REMOVE/COMMENT THIS
           if (image.naturalHeight > 0) {

            image.height = image.naturalHeight;
            image.width = image.naturalWidth;

            clearInterval(self.intervalRef);
            self.getOrientedImage(image, (img: HTMLImageElement) => {
                self.cropper.setImage(img);
                self.image.original = img;
                let bounds = self.cropper.getCropBounds();
                self.image.image = self.cropper.getCroppedImage().src;
                self.onCrop.emit(bounds);
            });
        }
    }, 100);

}`

from angular2-img-cropper.