CODEWITHSUNDEEP
javascriptangularjsfile-upload
sathish kumar
sathish kumar

Reputation: 936

How to auto-compress Images while uploading image in angularjs

Here is my HTML form:

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

I want to upload an image. Here if the file size is big(like 3 or 4 MB), I want to compress image automatically to 1MB or less than that. Any options are there to autocompress images in angularjs or javascript.

Upvotes: 0

Views: 5823

Answers (2)

Muhammad Usman
Muhammad Usman

Reputation: 10148

This Angular directive compresses jpeg or png files using angularjs on client side. Read more about it here

This module depends on angularjs, so make sure you've added angularjs dependency and then angular-image-compress.js. Something like

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

This is how you can achieve what you want.

 <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 used in above input tag are self explanatory

Upvotes: 1

swathi_sri
swathi_sri

Reputation: 417

you can use image-compressor, where you can specify your desired height and width of your image.

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

Upvotes: 2

Related Questions