img ng-src : TypeError: Converting circular structure to JSON

Question

I have to get a picture in a modal just after its upload. So I'm opening a modal ( $scope.openResizeModal() ), and putting my picture in my scope.

uploads.client.controller.js

$scope.openResizeModal = function (flow) {
        $scope.pictureToCrop = {};
        $scope.pictureToCrop = flow.files[0];
}

Then I try to print in on my HTML view :

resize-modal.client.view.html

<img-cropped src="{{pictureToCrop}}" selected='selected(cords)'></img-cropped>

And AngularJS tells :

Error: [$interpolate:interr] Can't interpolate: {{pictureToCrop}}
TypeError: Converting circular structure to JSON

I even tried with a classic

<img src={{pictureToCrop}} /> 

But it's the same.

Here is my directive :

angular.module('uploads').directive('imgCropped', function () {
return {
    restrict: 'E',
    replace: true,
    scope: { src: '@', selected: '&' },
    link: function (scope, element, attr) {
        var myImg;
        var clear = function () {
            if (myImg) {
                myImg.next().remove();
                myImg.remove();
                myImg = undefined;
            }
        };

        scope.$watch('src', function (nv) {
            clear();
            if (nv) {
                element.after('<img />');
                myImg = element.next();
                myImg.attr('src', nv);
                $(myImg).Jcrop({
                    trackDocument: true,
                    onSelect: function (x) {
                        scope.$apply(function () {
                            scope.selected({ cords: x });
                        });
                    },
                    aspectRatio: 1/1.4
                }, function () {
                    // Use the API to get the real image size 
                    var bounds = this.getBounds();
                    pwGlobal.boundx = bounds[0];
                    pwGlobal.boundy = bounds[1];
                });
            }
        });
        scope.$on('$destroy', clear);
    }
};

});

Thanks all !

Answer 1

It was a flow internal problem :

        var fileReader = new FileReader();
        fileReader.readAsDataURL(flow.files[0].file);
        fileReader.onload = function (event) {
            $scope.pictureToCrop = event.target.result;
        };

Solved my problem. The image is converted in base64 encode.