I am using the ngImgCrop angular directive to resize and crop an image.
However when I try and use it inside a UI Modal controller it doesn't work.
The issue I believe is that the below line does not get properly set
because the DOM is not created. The handlefileselect function never gets
called?!
angular.element(document.querySelector('#fileInput')).on('change',
handleFileSelect);
Does anybody know how to properly use this directive inside a Modal or how to
make this work?
The modal contoller code is here
.controller('ProfilePictureModalInstanceCtrl', function ($scope,
$modalInstance, items,$timeout) {
$scope.myImage = '';
$scope.myCroppedImage = '';
var handleFileSelect = function (evt) {
alert("Here");
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);
$scope.ok = function () {
$modalInstance.close($scope.optionItems);
};
$scope.cancel = function () {
$modalInstance.dismiss('cancel');
};});
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
