tushar-ng-drag-drop
Version:
Simple drag and drop for angular
62 lines (51 loc) • 1.49 kB
Markdown
# Angular Drag and Drop
A simple drag and drop library that help to move data from draggable to droppable.
## Demo

[Demo](https://stackblitz.com/edit/tushar-ng-drag-drop?file=src%2Fapp%2Fapp.component.html).
## Installation
As a prerequisite, you need [boostrap 3.X](https://getbootstrap.com) library.
```angular
npm i ngx-drag-drop
npm i tushar-ng-drag-drop
```
## Usage
#### App Module
```angular
import {DragDropModule} from 'drag-drop'
imports: [
DragDropModule
],
```
#### Html file
```angular
<tushar-ng-drag-drop
[documentList]="documentList"
[documentTypeList]="documentTypeList"
(onDraggable) ="onDraggableData($event)"
(onLeftDraggableDrop)="onLeftDraggableDrop($event)"
(onRightDraggableDrop)="onRightDraggableDrop($event)"
></tushar-ng-drag-drop>
```
#### Ts file
```angular
public documentList: any = [];
public documentTypeList: any = [];
constructor(){
}
onDraggableData(itemObj:any){
console.log(itemObj);
}
onLeftDraggableDrop(leftItemArr:any){
console.log(leftItemArr);
}
onRightDraggableDrop(rightItemArr:any){
console.log(rightItemArr);
}
```
## Contributing
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.
## Ref
[NgxDragDrop](https://www.npmjs.com/package/ngx-drag-drop)
## License
[MIT](https://choosealicense.com/licenses/mit/)