如何在angularjs上传图像时自动压缩图像

Posted 2021-05-06

这是我的html表单：

<form name="myForm" ng-submit="">
    <input ng-model='file' type="file"/>
    <input type="submit" value='Submit'/>
</form>

我想上传图片。这里如果文件大小很大（如3或4 MB），我想自动将图像压缩到1MB或更小。任何选项都可以在angularjs或javascript中自动压缩图像。

答案

This Angular指令在客户端使用angularjs压缩jpeg或png文件。阅读更多关于它here

此模块依赖于angularjs，因此请确保您已添加angularjs依赖项，然后添加angular-image-compress.js。就像是

angular.module('myApp', ['ngImageCompress']);

这就是你如何实现你想要的。

 <input id="inputImage" type="file" accept="image/*" image="image1" resize-max-height="800" resize-max-width="800" resize-quality="0.7" resize-type="image/jpg" ng-image-compress />

在Directives标签上使用的input是自我解释的

另一答案

您可以使用图像压缩器，您可以在其中指定所需的图像高度和宽度。

https://www.npmjs.com/package/image-compressor