<commit_before>[![npm version](https://badge.fury.io/js/ng-file-upload.svg)](http://badge.fury.io/js/ng-file-upload)
[![Downloads](http://img.shields.io/npm/dm/ng-file-upload.svg)](https://npmjs.org/package/ng-file-upload)
[![Issue Stats](http://issuestats.com/github/danialfarid/ng-file-upload/badge/pr)](http://issuestats.com/github/danialfarid/ng-file-upload)
[![Issue Stats](http://issuestats.com/github/danialfarid/ng-file-upload/badge/issue)](http://issuestats.com/github/danialfarid/ng-file-upload)<br/>
[![PayPayl donate button](https://img.shields.io/badge/paypal-donate-yellow.svg)](https://www.paypal.com/cgi-bin/webscr?cmd=_donations&business=danial%2efarid%40gmail%2ecom&lc=CA&item_name=ng%2dfile%2dupload&item_number=ng%2dfile%2dupload&currency_code=USD&bn=PP%2dDonationsBF%3abtn_donateCC_LG%2egif%3aNonHosted)
[![Gratipay donate button](https://img.shields.io/gratipay/danialfarid.svg?label=donate)](https://gratipay.com/ng-file-upload/)

ng-file-upload
===================

Lightweight Angular directive to upload files.

**See the <a href="https://angular-file-upload.appspot.com/" target="_blank">DEMO</a> page.** Reference docs [here](https://github.com/danialfarid/ng-file-upload/blob/master/README.md)

**Migration notes**: [version 3.0.x](https://github.com/danialfarid/ng-file-upload/releases/tag/3.0.0) [version 3.1.x](https://github.com/danialfarid/ng-file-upload/releases/tag/3.1.0) [version 3.2.x](https://github.com/danialfarid/ng-file-upload/releases/tag/3.2.3) [version 4.x.x](https://github.com/danialfarid/ng-file-upload/releases/tag/4.0.0) [version 5.x.x](https://github.com/danialfarid/ng-file-upload/releases/tag/5.0.0) [version 6.x.x](https://github.com/danialfarid/ng-file-upload/releases/tag/6.0.0) [version 6.2.x](https://github.com/danialfarid/ng-file-upload/releases/tag/6.2.0) [version 7.0.x](https://github.com/danialfarid/ng-file-upload/releases/tag/7.0.0) [version 7.2.x](https://github.com/danialfarid/ng-file-upload/releases/tag/7.2.0) [version 8.0.x](https://github.com/danialfarid/ng-file-upload/releases/tag/8.0.1) [version 9.0.x](https://github.com/danialfarid/ng-file-upload/releases/tag/9.0.0)


Ask questions on [StackOverflow](http://stackoverflow.com/) under the [ng-file-upload](http://stackoverflow.com/tags/ng-file-upload/) tag.<br/>
For bug report or feature request please search through existing [issues](https://github.com/danialfarid/ng-file-upload/issues) first then open a new one  [here](https://github.com/danialfarid/ng-file-upload/issues/new). For faster response provide steps to reprodce/versions with a jsfiddle from [here](http://jsfiddle.net/ew4jakn5/). Need paid support contact [me](mailto:<EMAIL>).<br/>
Contributions are always welcome. If you like this plugin give it a thumbs up at [ngmodules](http://ngmodules.org/modules/ng-file-upload).


Table of Content:
* [Features](#features)
* [Install](#install) ([Manual](#manual), [Bower](#bower), [NuGet](#nuget), [NPM](#npm))
* [Usage](#usage)
* [Old Browsers](#old_browsers)
* [Server Side](#server)
  * [Samples](#server) ([Java](#java), [Spring](#spring), [Node.js](#node), [Rails](#rails), [PHP](#php), [.Net](#net))
  * [CORS](#cors)
  * [Amazon S3 Upload](#s3)

##<a name="features"></a> Features
* file upload progress, cancel/abort
* file drag and drop (html5 only) 
* image paste form clipboard and drag and drop from browser pages (html5 only).
* image resize (html5 only)
* resumable uploads: pause/resume upload (html5 only) 
* validation on file type/size, image width/height, video/audio duration and `ng-required` support.
* show thumbnail or preview of selected images/audio/videos
* supports CORS and direct upload of file's binary data using `Upload.$http()`
* plenty of sample server side code, available on nuget
* on demand flash [FileAPI](https://github.com/mailru/FileAPI) shim loading no extra load for html5 browsers.
* HTML5 FileReader shim for IE8-9

##<a name="install"></a> Install

* <a name="manual"></a>**Manual**: download latest from [here](https://github.com/danialfarid/ng-file-upload-bower/releases/latest)
* <a name="bower"></a>**Bower**:
  * `bower install ng-file-upload-shim --save`(for non html5 suppport)
  * `bower install ng-file-upload --save`
* <a name="nuget"></a>**NuGet**: `PM> Install-Package angular-file-upload` (thanks to [<NAME>](https://github.com/georgiosd))
* <a name="npm"></a>**NPM**: `npm install ng-file-upload`
```html
<script src="angular(.min).js"></script>
<script src="ng-file-upload-shim(.min).js"></script> <!-- for no html5 browsers support -->
<script src="ng-file-upload(.min).js"></script>
```

##<a name="usage"></a> Usage

###Samples:
* Upload with form submit and validations: [http://jsfiddle.net/danialfarid/maqbzv15/38/](http://jsfiddle.net/danialfarid/maqbzv15/38/)
* Upload multiple files one by one on file select:
[http://jsfiddle.net/danialfarid/2vq88rfs/136/](http://jsfiddle.net/danialfarid/2vq88rfs/136/)
* Upload multiple files in one request on file select (html5 only):
[http://jsfiddle.net/danialfarid/huhjo9jm/5/](http://jsfiddle.net/danialfarid/huhjo9jm/5/)
* Upload single file on file select:
[http://jsfiddle.net/danialfarid/0mz6ff9o/135/](http://jsfiddle.net/danialfarid/0mz6ff9o/135/)
* Drop and upload with $watch:
[http://jsfiddle.net/danialfarid/s8kc7wg0/112](http://jsfiddle.net/danialfarid/s8kc7wg0/112)
```html
<script src="angular.min.js"></script><commit_msg>tMerge branch 'master' of https://github.com/danialfarid/angular-file-upload<commit_after>[![npm version](https://badge.fury.io/js/ng-file-upload.svg)](http://badge.fury.io/js/ng-file-upload)
[![Downloads](http://img.shields.io/npm/dm/ng-file-upload.svg)](https://npmjs.org/package/ng-file-upload)
[![Issue Stats](http://issuestats.com/github/danialfarid/ng-file-upload/badge/pr)](http://issuestats.com/github/danialfarid/ng-file-upload)
[![Issue Stats](http://issuestats.com/github/danialfarid/ng-file-upload/badge/issue)](http://issuestats.com/github/danialfarid/ng-file-upload)<br/>
[![PayPayl donate button](https://img.shields.io/badge/paypal-donate-yellow.svg)](https://www.paypal.com/cgi-bin/webscr?cmd=_donations&business=danial%2efarid%40gmail%2ecom&lc=CA&item_name=ng%2dfile%2dupload&item_number=ng%2dfile%2dupload&currency_code=USD&bn=PP%2dDonationsBF%3abtn_donateCC_LG%2egif%3aNonHosted)
[![Gratipay donate button](https://img.shields.io/gratipay/danialfarid.svg?label=donate)](https://gratipay.com/ng-file-upload/)

ng-file-upload
===================

Lightweight Angular directive to upload files.

**See the <a href="https://angular-file-upload.appspot.com/" target="_blank">DEMO</a> page.** Reference docs [here](https://github.com/danialfarid/ng-file-upload/blob/master/README.md)

**Migration notes**: [version 3.0.x](https://github.com/danialfarid/ng-file-upload/releases/tag/3.0.0) [version 3.1.x](https://github.com/danialfarid/ng-file-upload/releases/tag/3.1.0) [version 3.2.x](https://github.com/danialfarid/ng-file-upload/releases/tag/3.2.3) [version 4.x.x](https://github.com/danialfarid/ng-file-upload/releases/tag/4.0.0) [version 5.x.x](https://github.com/danialfarid/ng-file-upload/releases/tag/5.0.0) [version 6.x.x](https://github.com/danialfarid/ng-file-upload/releases/tag/6.0.0) [version 6.2.x](https://github.com/danialfarid/ng-file-upload/releases/tag/6.2.0) [version 7.0.x](https://github.com/danialfarid/ng-file-upload/releases/tag/7.0.0) [version 7.2.x](https://github.com/danialfarid/ng-file-upload/releases/tag/7.2.0) [version 8.0.x](https://github.com/danialfarid/ng-file-upload/releases/tag/8.0.1) [version 9.0.x](https://github.com/danialfarid/ng-file-upload/releases/tag/9.0.0)


Ask questions on [StackOverflow](http://stackoverflow.com/) under the [ng-file-upload](http://stackoverflow.com/tags/ng-file-upload/) tag.<br/>
For bug report or feature request please search through existing [issues](https://github.com/danialfarid/ng-file-upload/issues) first then open a new one  [here](https://github.com/danialfarid/ng-file-upload/issues/new). For faster response provide steps to reprodce/versions with a jsfiddle from [here](http://jsfiddle.net/ew4jakn5/). Need paid support contact [me](mailto:<EMAIL>).<br/>
Contributions are always welcome. If you like this plugin give it a thumbs up at [ngmodules](http://ngmodules.org/modules/ng-file-upload).


Table of Content:
* [Features](#features)
* [Install](#install) ([Manual](#manual), [Bower](#bower), [NuGet](#nuget), [NPM](#npm))
* [Usage](#usage)
* [Old Browsers](#old_browsers)
* [Server Side](#server)
  * [Samples](#server) ([Java](#java), [Spring](#spring), [Node.js](#node), [Rails](#rails), [PHP](#php), [.Net](#net))
  * [CORS](#cors)
  * [Amazon S3 Upload](#s3)

##<a name="features"></a> Features
* file upload progress, cancel/abort
* file drag and drop (html5 only) 
* image paste form clipboard and drag and drop from browser pages (html5 only).
* image resize native and image crop through [ngImgCrop](https://github.com/alexk111/ngImgCrop). See [crop sample](http://jsfiddle.net/xxo3sk41/1/) (html5 only) 
* resumable uploads: pause/resume upload (html5 only) 
* validation on file type/size, image width/height, video/audio duration and `ng-required` support.
* show thumbnail or preview of selected images/audio/videos
* supports CORS and direct upload of file's binary data using `Upload.$http()`
* plenty of sample server side code, available on nuget
* on demand flash [FileAPI](https://github.com/mailru/FileAPI) shim loading no extra load for html5 browsers.
* HTML5 FileReader shim for IE8-9

##<a name="install"></a> Install

* <a name="manual"></a>**Manual**: download latest from [here](https://github.com/danialfarid/ng-file-upload-bower/releases/latest)
* <a name="bower"></a>**Bower**:
  * `bower install ng-file-upload-shim --save`(for non html5 suppport)
  * `bower install ng-file-upload --save`
* <a name="nuget"></a>**NuGet**: `PM> Install-Package angular-file-upload` (thanks to [<NAME>](https://github.com/georgiosd))
* <a name="npm"></a>**NPM**: `npm install ng-file-upload`
```html
<script src="angular(.min).js"></script>
<script src="ng-file-upload-shim(.min).js"></script> <!-- for no html5 browsers support -->
<script src="ng-file-upload(.min).js"></script>
```

##<a name="usage"></a> Usage

###Samples:
* Upload with form submit and validations: [http://jsfiddle.net/danialfarid/maqbzv15/38/](http://jsfiddle.net/danialfarid/maqbzv15/38/)
* Upload multiple files one by one on file select:
[http://jsfiddle.net/danialfarid/2vq88rfs/136/](http://jsfiddle.net/danialfarid/2vq88rfs/136/)
* Upload multiple files in one request on file select (html5 only):
[http://jsfiddle.net/danialfarid/huhjo9jm/5/](http://jsfiddle.net/danialfarid/huhjo9jm/5/)
* Upload single file on file select:
[http://jsfiddle.net/danialfarid/0mz6ff9o/135/](http://jsfiddle.net/danialfarid/0mz6ff9o/135/)
* Drop and upload with $watch:
[http://jsfiddle.net/danialfarid/s8kc7wg0/112](http://jsfiddle.net/danialfarid/s8kc7wg0/112)
* Image Crop and Upload
[http://jsfiddle.net/xxo3sk41/1/](http://jsfiddle.net/xxo3sk41/1/)
```html
<script src="angular.min.js"></script>
{'fraction_non_alphanumeric': 0.1958641863825176, 'fraction_numerical': 0.024291132382156404, 'mean_word_length': 5.27123442808607, 'pattern_counts': {'":': 0, '<': 63, '<?xml version=': 0, '>': 65, 'https://': 50, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 4, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5840419', 'n_tokens_mistral': 4330, 'n_tokens_neox': 3986, 'n_words': 665}