我有一个关于图片上传的问题。
也许我做错了什么？
$scope.photoChanged = function(files) {
$scope.files = files;
var reader = new FileReader();
reader.onload = function(e) {
$scope.imagecontent = e.target.result;
if (!$scope.$$phase) {
$scope.$apply();
}
};
reader.readAsDataURL(files[0]);
};
这里我尝试将图像上传到浏览器并查看它(然后我使用裁剪工具)，但是对于大图像，例如:https://dl.dropboxusercontent.com/u/59666091/Fronalpstock_big.jpg
在 IE 中(不仅在 IE 中)这需要一段时间，当我在页面上看到图像时
也许有一些方法可以加快我的文件上传速度？
在这里你可以测试它:http://plnkr.co/edit/co6gFGe6pig3DCF9GQp1?p=preview
最佳答案
在显示之前尝试裁剪图像或将其调整为标准尺寸。事实是，您不需要非常大的文件就可以在浏览器上显示它。
请试试这个裁剪: http://andyshora.com/angular-image-cropper.html
请尝试调整大小: https://blog.liip.ch/archive/2013/05/28/resizing-images-with-javascript.html
============================================= ========================
<body ng-controller="ArticleCtrl">
<h1>Hello Plunker, {{art}}!</h1>
<input type="file" name="file" accept="image/*" onchange="angular.element(this).scope().photoChanged(this.files)" />
<div id="mySpinner" class="spinner first"></div>
<img width="100px" id="preview" />
</body>
$scope.photoChanged = function(files) {
$scope.files = files;
var reader = new FileReader();
reader.onload = function(e) {
//$scope.imagecontent = e.target.result;
var image = new Image();
image.src = e.target.result;
console.log(image);
image.onload = function() {
jQuery("#preview").attr('src', this.src);
};
if (!$scope.$$phase) {
$scope.$apply();
}
};
reader.readAsDataURL(files[0]);
};
嗨，brabertaser!我已经在 plunker 上修改了你的代码。但我不确定它是否会工作，因为我没有在我当前的机器上安装 ie10 和 11，但它应该是这样的......
谢谢!希望这会有所帮助:)
关于javascript - AngularJS:speedUp打开大图(base64)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30397634/