Components: cdkDragDrop: a way to disable the placeholders and animations on origin/destiny lists during a dragging action uppon given condition

Created on 8 Aug 2019 · 6Comments · Source: angular/components

Feature Description

Ability to disable the displacement of items during the drag and drop actions

Use Case

Suppose you are using the cdkDropListSortingDisabled directive. When you drag an item from the source, you left a placeholder behind, at the source list, while you're dragging.

Now imagine a situation where you have four instances of each item on the source list. Each item type appears just once on the list. The amount of instances of each type is actually represented by a number in the item (a badge, for example) instead of additional items on the list.

For example, in the item named after 'carrots', you'd have the number 10, indicating that you have 10 carrots at the store. When you drag a carrot item to your basket, instead of seeing a placeholder on the source, you'd see the real item. So you'd have at the same time the dragging copy of the item and the original item visible on the source list. When you finally dropped the item on the destiny list, you could finally decrease the number of available carrots and, eventually increase the number of carrots on your basket, without any place holder animation displacing items on the lists when the item type is already present on the origin/destiny lists.

The main point is: when you're dragging... is there a way to move an item from the source without actually erasing it from the source element and drop it on the destiny without necessarily add a new item there. The behavior would be like upon some @Input setting. Basically I want to disable the items displacement (also disabling the placeholders) in the origin and destiny without preventing the other events?