Проблемы с динамикой c высота в CdkDropList - PullRequest
0 голосов
/ 27 февраля 2020

Я использую CdkDragDrop для создания динамической сетки c, которая может быть реструктурирована с помощью перетаскивания пользователем. Я создал этот StackBlitz, чтобы проиллюстрировать как мой вариант использования, так и проблему, с которой я сталкиваюсь https://stackblitz.com/edit/angular-rvv4g9.

Когда у меня есть два элемента в одной строке, я бы хотел отбросить один из элементы в пустой строке, чтобы отделить их и создать новую строку. Для этого я вставил пустые строки между всеми строками, когда вы перетаскиваете элемент, он отображается красным фоном. Поскольку элементы, которые я перетаскиваю, имеют довольно большую высоту, я хотел бы, чтобы пустые строки начинались с малого, а при вставке в них элементов расширяйте их.

Проблема, с которой я сталкиваюсь, заключается в том, что при перетаскивании например, элемент «1» над строкой между ним и «3», вы можете видеть, как расширяется строка, затем продолжайте перетаскивать «1» ниже «3», и вы не можете выбросить элемент там.

Я думаю, что "область отбрасывания" не пересчитывается и блокируется другим расширенным элементом.

Кто-нибудь знает способ пересчета области отбрасывания или каким-либо другим способом что я мог решить это?

1 Ответ

0 голосов
/ 01 марта 2020

Для этого можно использовать пользовательский заполнитель для перетаскивания:

<div class="example-custom-placeholder" *cdkDragPlaceholder></div>

См. Мой Stackblitz:

https://stackblitz.com/edit/angular-vy9yvj

enter image description here

...