Drag and drop module for Angular JS with support for touch devices
npm install ngdraggablengDraggable
===========
> NOTE:
> I'm not actively maintaining this project any more. If any anyone would like to take on that responsible please get in touch
Drag and drop module for Angular JS with support for touch devices. demo.
- Install: bower install ngDraggable
- Add angular and ngDraggable to your code:
``html`
- Add a dependency to the ngDraggable module in your application.
`js`
angular.module('app', ['ngDraggable']);
- Add attribute directives to your html:
Draggable usage:
`html`
Draggable div
* ng-center-anchor is optional. If not specified, it defaults to false.ng-drag-handle
* If the draggable is also clickable (ng-click, ng-dblclick) the script wont react.
* You can define a drag-button as child with the attribute .
`ng-drag-start` and `ng-drag-move` is also available. Add to the ng-drop element.ng-drag-stop can be used when you want to react to the user dragging an item and it wasn't dropped into the target container.
`draggable:start`, `draggable:move` and `draggable:end` events are broadcast on drag actions.
Drop area usage:
`html`
Drop area
`js`
app.controller('MainCtrl', function ($scope) {
$scope.onDragComplete=function(data,evt){
console.log("drag success, data:", data);
}
$scope.onDropComplete=function(data,evt){
console.log("drop success, data:", data);
}
};