当我上传图像时,我有这种奇怪的行为,如果这个图像尺寸高于我的图像旋转90度.
检查这个使用ngImgCrop的fiddle,这是我正在上传的image
ngDmgCrop的代码非常标准:
angular.module('app',['ngImgCrop']) .controller('Ctrl',function($scope) { $scope.myImage=''; $scope.myCroppedImage=''; 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); });
我该如何解决这个问题呢?
您必须解析图像标题中的exif数据,检查Orientation标记,然后相应地旋转.
原文链接:https://www.f2er.com/angularjs/142126.html我刚刚用这个库解决了同样的问题:Javascript Load Image
在你的app.js中
var handleFileSelect = function(evt) { var target = evt.dataTransfer || evt.target; var file = target && target.files && target.files[0]; var options = {canvas:true}; var displayImg = function(img) { $scope.$apply(function($scope){ $scope.myImage=img.toDataURL(); }); } loadImage.parseMetaData(file,function (data) { if (data.exif) { options.orientation = data.exif.get('Orientation'); } loadImage(file,displayImg,options ); }); };
演示:Plunker
干杯.