Top 5 Angular 2 Drag and Drop Demos

This is what I think are the best and probably only options at the moment for Angular 2 Drag and Drop Demos. I’ve specifically included the Angular 2 demo links so that you can quickly try them out for yourself to see if they would be suitable for your angular2 project. There are several popular 3rd party module systems out there and options are limited at the moment as AngularJS 2 is fairly new kid on the block so I would be looking for something stable with high testability rather than fancy features or such which might break your app! Also look out for ES6 and TypeScript support. Does ng-drag and ng-drop exist yet? 😉

This is also following on from my post Top 5 Drag and Drop AngularJS Modules

1. Dracula Angular 2 Drag and Drop Demo

Dracula Angular 2 Drag and Drop Demo
Dracula Angular 2 Drag and Drop Demo

Simple drag and drop with dragula.

Code Angular 2 Demo

2. Prime Faces Angular 2 Drag and Drop Demo

Prime Faces Angular 2 Drag and Drop Demo
Prime Faces Angular 2 Drag and Drop Demo

pDraggable and pDroppable directives apply drag-drop behaviors to any element.

Angular 2 Demo

3. Angular2 Grid drag/drop/resize Demo

Angular2 Grid drag/drop/resize Demo
Angular2 Grid drag/drop/resize Demo

Angular 2 grid is a drag/drop/resize grid-based plugin directive for Angular 2.

Code Angular 2 Demo

4. Angular 2 Drag Drop List Component Demo

Angular 2 Drag Drop List Component Demo
Angular 2 Drag Drop List Component Demo

Angular 2 component for a dual listbox control.

Code Angular 2 Demo

5. Drag and Drop in Angular 2 using Native HTML5 API

Drag and Drop in Angular 2 using Native HTML5 API
Drag and Drop in Angular 2 using Native HTML5 API

Simple drag and drop in Angular 2 using Native HTML5 API

Article Code Angular 2 Demo

I found without demos but might still be useful reference:

Sam is a passionate web developer, online entrepreneur and investor. In his spare time he enjoys coding, playing chess and reading.

Leave a Reply

Your email address will not be published. Required fields are marked *