NgxMegaSimpleDragDropList
Angular 2/3/4/5/6/7 Drag Drop Simple Reordable List Items
Screenshot
*had to photoshop the little dragging cursor. Guess it will look different in different OS's and browsers
Demo
https://ives.me/NgxMegaSimpleDragDropListDemoWithNpmPackage/
Install
npm i ngx-mega-simple-drag-drop-list
app.module.ts
;
app.component.ts
;
app.component.html
{{item}}
app.component.css
API
Inputs
Input | Type | Default | Required | Description |
---|---|---|---|---|
items | array |
any[] |
yes | Array to reorder |
index | number |
null | yes | Index of the current element |
hoverStyle | string |
hover | no | Css class name when hovering |
dragStyle | string |
draggin | no | Css class name when dragging the element |
isSwap | boolean |
false |
no | Controls if you want to swap items in the array or reorder the whole array |
Outputs
Output | Type | Description |
---|---|---|
(dropped) | array |
Returns the array |