ngx-droppable
Give file dropping super-powers to any element or component
Based on droppable.js
Demo: https://ngx-droppable.netlify.com/
Install
npm install @ctrl/ngx-droppableUse
Import and Add to module
import { DroppableModule } from '@ctrl/ngx-droppable';Add droppable directive to element
<div droppable (filesDropped)="handleFilesDropped($event)"></div>[Inputs]
| name | type | default | description |
|---|---|---|---|
| isClickable | boolean | true | prompt for files when clicked |
| acceptsMultipleFiles | boolean | true | allow multiple files dropped or selected |
| appendStatusClasses | boolean | true | append CSS class when files are dragged on element |
| dragOverClass | string | 'dragover' | class added when files are hovered over element |
| accept | string | false | false | limit accepted file types via MIME see mdn |
(Ouput)
| name | type | description |
|---|---|---|
| filesDropped | File[] | An array of the files blobs that have been added |
License
MIT
