Search code examples
angulardrag-and-dropangular-cdk

Can I get a cdkDrag element to emit a dropped event without cdkDragList container?


I’m working moving an app from angularjs over to Angular 7. I have a map tool for keeping track of game pieces on a grid. Right now how it works is I listen for drag/drop events on each game piece and on the drop event I update the game piece's x/y position in the db. I’m looking here at https://material.angular.io/cdk/drag-drop and it doesn’t look like I can recreate that functionality. No matter how I set it up, I can't get the cdkDragDropped event to fire (or any of the other events for that matter).

When I try to use these pieces within a cdkDropList, the pieces become locked in place and can only switch places with one another, not freely dragged around. Is there any way to listen to drop events from a cdkDrag element outside of a cdkDropList? Or perhaps free up draggables once they're in a cdkDropList so they can move around more freely?

Failing all of that, can anyone recommend me a better drag and drop plugin for Angular 7? :D


Solution

  • The answer is cdkDragReleased, which works without a container.