当我上传图像时,我有这种奇怪的行为,如果这个图像尺寸高于我的图像旋转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标记,然后相应地旋转.
我刚刚用这个库解决了同样的问题：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
干杯.
