3

I have a left and a right div. The left div contains a cdkDropList. What I want to archieve, is that the items of the DropList stay in the right div once dragged there. The Status quo is that they always move back into the DropList once dropped into something that is not a cdkDropList.

Basically I want to create a cdkDrag out of the elements of a cdkDropList. The elements of a DropList already are cdkDrags, however i cannot seem to seperate them from the DropList.

Edit: I do not want to transfer an item from one list to another. I want to drag an item from a droplist and drop it anywhere i want. For example in the example documentaion take an item from the second example, and when dropped it becomes the third example.

NicO
  • 591
  • 2
  • 8
  • 21

1 Answers1

-2

A quick look at the Angular Material could've helped you way faster I guess.

Angular Material Documentation: Look for the last example => Drag&Drop connected sorting

And here is a Stackblitz example for that

Sidson Aidson
  • 15
  • 6
  • I do **not** want to transfer an item from one list to another. I want to drag an item from a droplist and drop it anywhere i want. For example [in the example documentaion](https://material.angular.io/cdk/drag-drop/examples) take an item from the second example, and when dropped it becomes the third example. – NicO Jun 28 '19 at 09:00
  • Oh okay! I misunderstood the question my bad! Maybe [this stackoverflow](https://stackoverflow.com/questions/53239092/angular-7-drag-and-drop-dynamically-create-drop-zones) can help then – Sidson Aidson Jun 28 '19 at 12:08
  • 2
    If i understood this thread correctly, It still isnt what i want, since it still only transfers items between lists. I essentially want to seperate the cdkDrag element from the dropList and not transfer it between them. – NicO Jun 28 '19 at 12:16