Can this work with angular 1.3?

[faidoc]

I'm trying to include this module in an Angular 1.3 app but I get evt.target.result as undefined

In my html I have:

<div class="text-center form-group">
    <span class="btn btn-default btn-file">
            Select Image <input type="file" id="fileInput">
    </span>
    </div>
    <div class="text-center form-group">
        <img-crop image="myImage" result-image="croppedImage" area-type="square" result-image-size="250"></img-crop>
    </div>
    <div><img ng-src="{{croppedImage}}" /></div>
</div>

And in my controller I have:

        $scope.myImage='';
        $scope.croppedImage='';

         var handleFileSelect=function(evt) {
            var file=evt.currentTarget.files[0];
            var reader = new FileReader();
            reader.onload = function (evt) {
                $scope.$apply(function($scope){
                    $scope.myImage=evt.target.result;
                });
            };
            reader.readAsDataURL(file);
        };
        angular.element(document.querySelector('#fileInput')).on('change',handleFileSelect); ```

[SimonStiph]

I'm currently using ngImgCrop with Angular 1.3, I can confirm that that isn't your issue here. I can't spot out your problem (I'm too busy on my own :) Here's an excerpt from my code, though.

P.S. I had to chop unrelated code out of the controller, but hopefully you get the gist.

View:

                    <img-crop image="uncroppedImage"
                              result-image="croppedImage"
                              area-type="square"
                              result-image-format="image/jpeg"
                              result-image-size="800"
                              result-image-quality=".6"
                              on-load-begin="clearImageCache()">
                    </img-crop>

Controller:

app.controller('myController', ['$scope', '$state', '$stateParams',
    function ($scope, $state, $stateParams) {

    $scope.uncroppedImage = null;
    $scope.croppedImage   = null;

    var handleFileSelect = function (event) {
        var file = event.currentTarget.files[0];
        var reader = new FileReader();
        reader.onload = function (event) {
            $scope.$apply (function ($scope) {
                $scope.uncroppedImage = event.target.result;
            });
        };
        reader.readAsDataURL(file);
    };

    $(document).on('change', '#fileInput', function (event) {
        handleFileSelect(event);
    });

    $scope.clearImageCache = function () {
        $scope.uncroppedImage = null;
        $scope.croppedImage   = null;
    }
}
]);

[23tux]

Any news on this?

[jrran90]

I've tried @simonstiphanos suggestion and it works fine.. seems like this plugin hasn't been updated and currently having some bugs with 1.3 version of angularjs...

Update: just looked on bower.json, and seems like the current dependencies it supports as of now is "angular": "~1.2.19"

[devolkpl]

Still not working at all. Angular 1.3.19

[fernoftheandes]

Here is a fiddle with ngImgCrop working for angular 1.3.15.

[agungsb]

@fernoftheandes I've checked the fiddle you referenced. But I found something wrong. I tried to display {{myCroppedImage}} and I could see that there was already a dataURL assigned to that scope.

[yrfandrew]

Still not working at all. Angular 1.5.0

[kukac7]

@yrfandre bower.json

"overrides": {
"ng-img-crop": {
        "dependencies": {
            "angular": "*"
        }
    }
}