[英]Image Width Height Via AngularJS (ng-file-upload)
I need to validate the image width - height on the basis of 1:3 ratio. 我需要根据1:3的比例来验证图像的宽度-高度。 I am using ng-file-upload to upload the image.
我正在使用ng-file-upload上传图片。 The validation needs to be done before sending it to server.
验证需要先完成,然后再发送到服务器。
I am clueless about how to get the image width/height from the selected image. 我对如何从所选图像中获取图像宽度/高度一无所知。 Can somebody help me out ?
有人可以帮我吗?
I am following the tutorial from this site : http://odetocode.com/blogs/scott/archive/2013/07/03/building-a-filereader-service-for-angularjs-the-service.aspx 我正在从此网站上关注教程: http : //odetocode.com/blogs/scott/archive/2013/07/03/building-a-filereader-service-for-angularjs-the-service.aspx
That would be a feature request for the plugin. 这将是该插件的功能请求。 As a workaround you can do this:
作为解决方法,您可以执行以下操作:
<div ngf-select ngf-model="image" ngf-validate-fn-async="validateRatio(image)" ngf-pattern="'image/*'" accept="image/*" >
$scope.validateRatio = function(image) {
var defer = $q.defer();
Upload.imageDimensions(image).then(function(d) {
if (d.width / d.height === expectedRatio) {
defer.resolve()
} else {
defer.reject();
}
}, function() {defer.reject();});
return defer.promise;
}
or 要么
<div ngf-select ngf-model="image" ngf-pattern="'image/*'" ngf-min-height="0" accept="image/*" >
<div ng-show="image.width && (image.width / image.height !== expectedRatio)">Invalid ratio?
EDIT Feature is added You can have 编辑功能已添加您可以拥有
<div ngf-select ngf-model="image" ngf-ratio="1x3" ngf-pattern="'image/*'" accept="image/*" >
When you have uploaded the file, are you assigning the DOM element with an ID? 上传文件后,是否要为DOM元素分配ID? If so, plain JS could work such as:
如果是这样,纯JS可以像这样工作:
var img = document.getElementById('imageid');
var width = img.clientWidth;
var height = img.clientHeight;
var image = angular.element('<CLASS_NAME or ID_NAME>');
$scope.width = image.width();
$scope.height = image.height();
Hope this helps You!. 希望对您有帮助!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.