Drag and drop directives for Angular using native HTML5 API.
bower install angular-draganddrop
npm install angular-draganddrop
<!-- Load files. --><!-- Draggable element. --><!-- Dropzone element. -->
- "draggable" Make the element draggable. Accepts a boolean.
- "effect-allowed" Allowed effects for the dragged element, see https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer#effectAllowed.28.29. Accepts a string.
- "draggable-type" Type of data object attached to the dragged element, this type is prefixed by "json/". Accepts a string.
- "draggable-data" Data attached to the dragged element, data are serialized in JSON. Accepts an Angular expression.
The draggable directive serializes data as JSON and prefix the specified type with "json/".
- "drop" Drop handler, executed on drop. Accepts an Angular expression.
- "drop-effect" Drop effect to set, see https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer#dropEffect.28.29. Accepts a string.
- "drop-accept" Types accepted or function to prevent unauthorized drag and drop. Accepts a string, an array, a function or a boolean.
- "drag-over" Drag over handler, executed on drag over. Accepts an Angular expression.
- "drag-over-class" Class set on drag over, when the drag is authorized. Accepts a string.
The drop directive automatically unserializes data with the "json" format, other data are not formatted.
All navigators that support the native HTML5 API should be supported.
Tested on Firefox 24+, Chrome 31+.