{"id":13481095,"url":"https://github.com/valor-software/ng2-file-upload","last_synced_at":"2025-05-12T13:15:27.972Z","repository":{"id":1207860,"uuid":"41478768","full_name":"valor-software/ng2-file-upload","owner":"valor-software","description":"Easy to use Angular components for files upload","archived":false,"fork":false,"pushed_at":"2025-01-15T10:05:25.000Z","size":20230,"stargazers_count":1912,"open_issues_count":426,"forks_count":661,"subscribers_count":73,"default_branch":"development","last_synced_at":"2025-05-09T06:41:58.216Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"http://valor-software.github.io/ng2-file-upload/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/valor-software.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2015-08-27T09:48:28.000Z","updated_at":"2025-05-03T16:28:56.000Z","dependencies_parsed_at":"2024-09-24T23:00:57.433Z","dependency_job_id":"afe5f0a9-7525-4126-834c-24aa862c2312","html_url":"https://github.com/valor-software/ng2-file-upload","commit_stats":{"total_commits":196,"total_committers":47,"mean_commits":4.170212765957447,"dds":0.7602040816326531,"last_synced_commit":"f7a066b8e0cbc64e7edb086302327df279b95643"},"previous_names":[],"tags_count":18,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/valor-software%2Fng2-file-upload","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/valor-software%2Fng2-file-upload/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/valor-software%2Fng2-file-upload/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/valor-software%2Fng2-file-upload/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/valor-software","download_url":"https://codeload.github.com/valor-software/ng2-file-upload/tar.gz/refs/heads/development","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253421623,"owners_count":21905786,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-07-31T17:00:48.640Z","updated_at":"2025-05-12T13:15:27.945Z","avatar_url":"https://github.com/valor-software.png","language":"TypeScript","readme":"# ng2-file-upload [![npm version](https://badge.fury.io/js/ng2-file-upload.svg)](http://badge.fury.io/js/ng2-file-upload) [![npm downloads](https://img.shields.io/npm/dm/ng2-file-upload.svg)](https://npmjs.org/ng2-file-upload)\nEasy to use Angular2 directives for files upload ([demo](http://valor-software.github.io/ng2-file-upload/))\n\n[![Angular 2 Style Guide](https://mgechev.github.io/angular2-style-guide/images/badge.svg)](https://github.com/mgechev/angular2-style-guide)\n[![Build Status](https://travis-ci.org/valor-software/ng2-file-upload.svg?branch=development)](https://travis-ci.org/valor-software/ng2-file-upload)\n\n## Quick start\n\n1. A recommended way to install ***ng2-file-upload*** is through [npm](https://www.npmjs.com/search?q=ng2-file-upload) package manager using the following command:\n\n  `npm i ng2-file-upload`\n\n  Alternatively, you can [download it in a ZIP file](https://github.com/valor-software/ng2-file-upload/archive/master.zip).\n\n2. Currently `ng2-file-upload` contains two directives: `ng2-file-select` and `ng2-file-drop`. `ng2-file-select` is used for 'file-input' field of form and\n  `ng2-file-drop` is used for area that will be used for dropping of file or files.\n\n3. More information regarding using of ***ng2-file-upload*** is located in\n  [demo](http://valor-software.github.io/ng2-file-upload/) and [demo sources](https://github.com/valor-software/ng2-file-upload/tree/master/demo).\n\n## Using ***ng2-file-upload*** in a project\n\n1. Install as shown in the above section.\n\n2. Import `FileUploadModule` into the module that declares the component using ***ng2-file-upload***:\n\n```import { FileUploadModule } from 'ng2-file-upload';```\n\n3. Add it to `[imports]` under `@NgModule`:\n\n```imports: [ ... FileUploadModule, ... ]```\n\n4. Import `FileUploader` into the component:\n\n```import {  FileUploader } from 'ng2-file-upload';```\n\n5. Create a variable for the API url:\n\n```const URL = 'path_to_api';```\n\n6. Initialize it:\n\n```public uploader:FileUploader = new FileUploader({url: URL}); ```\n\n## API for `ng2FileSelect`\n\n### Properties\n\n  - `uploader` - (`FileUploader`) - uploader object. See using in [demo](https://github.com/valor-software/ng2-file-upload/blob/master/demo/components/file-upload/simple-demo.ts)\n\n### Events\n - `onFileSelected` - fires when files are selected and added to the uploader queue\n\n## API for `ng2FileDrop`\n\n### Properties\n\n  - `uploader` - (`FileUploader`) - uploader object. See using in [demo](https://github.com/valor-software/ng2-file-upload/blob/master/demo/components/file-upload/simple-demo.ts)\n\n  Parameters supported by this object:\n\n  1. `url` - URL of File Uploader's route\n  2. `authToken` - Auth token that will be applied as 'Authorization' header during file send.\n  3. `disableMultipart` - If 'true', disable using a multipart form for file upload and instead stream the file. Some APIs (e.g. Amazon S3) may expect the file to be streamed rather than sent via a form. Defaults to false.\n  4. `itemAlias` - item alias (form name redefinition)\n  5. `formatDataFunction` - Function to modify the request body. 'DisableMultipart' must be 'true' for this function to be called.\n  6. `formatDataFunctionIsAsync` - Informs if the function sent in 'formatDataFunction' is asynchronous. Defaults to false.\n  7. `parametersBeforeFiles` - States if additional parameters should be appended before or after the file. Defaults to false.\n\n### Events\n\n  - `fileOver` - it fires during 'over' and 'out' events for Drop Area; returns `boolean`: `true` if file is over Drop Area, `false` in case of out.\n  See using in [ts demo](https://github.com/valor-software/ng2-file-upload/blob/master/demo/components/file-upload/simple-demo.ts) and\n  [html demo](https://github.com/valor-software/ng2-file-upload/blob/master/demo/components/file-upload/simple-demo.html)\n  - `onFileDrop` - it fires after a file has been dropped on a Drop Area; you can pass in `$event` to get the list of files that were dropped. i.e. `(onFileDrop)=\"dropped($event)\"`\n\n# Troubleshooting\n\nPlease follow these guidelines when reporting bugs and feature requests:\n\n1. Use [GitHub Issues](https://github.com/valor-software/ng2-file-upload/issues) board to report bugs and feature requests (not our email address)\n2. Please **always** write steps to reproduce the error. That way we can focus on fixing the bug, not scratching our heads trying to reproduce it.\n\nThanks for understanding!\n\n### License\n\nThe MIT License (see the [LICENSE](https://github.com/valor-software/ng2-file-upload/blob/master/LICENSE) file for the full text)\n","funding_links":[],"categories":["Uncategorized","others","Third Party Components","Table of Contents","Awesome Angular [![Awesome TipeIO](https://img.shields.io/badge/Awesome%20Angular-@TipeIO-6C6AE7.svg)](https://github.com/gdi2290/awesome-angular) [![Awesome devarchy.com](https://img.shields.io/badge/Awesome%20Angular-@devarchy.com-86BDC1.svg)](https://github.com/brillout/awesome-angular-components)"],"sub_categories":["Uncategorized","File Upload","File Libraries","Angular \u003ca id=\"angular\"\u003e\u003c/a\u003e"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvalor-software%2Fng2-file-upload","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvalor-software%2Fng2-file-upload","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvalor-software%2Fng2-file-upload/lists"}