Угловое перетаскивание не удается перетащить в правильное положение в диалоговом окне mat

#angular #drag-and-drop

Вопрос:

У меня есть длинный список элементов, и я хотел бы перетащить их, чтобы изменить положение в списке.

Если он используется в простом компоненте, я могу перетащить его в любое положение. Во время перетаскивания я могу прокручивать элементы, которые находятся за пределами видимого диапазона, и я могу перейти к прокручиваемым элементам.

Но когда я помещаю список в диалоговое окно «Коврик». Я могу перетаскивать и опускать в видимом диапазоне. Если перетащить на прокручиваемые элементы, положение для удаления станет неправильным.

В этом и заключается проблема записи http://g.recordit.co/FMMLqC69g4.gif Это cdkDropList не устанавливает высоту и переполнение-y в родительском div.

Я привел пример стекблитца

Я снова модифицирую стекблитц. Если список cdkDropList находится под набором высоты и переполнения-y: прокрутка, то перетаскивание не работает должным образом.

Кто-нибудь знает, как исправить эту проблему или какой-либо обходной путь. Я нашел некоторые обходные решения, но ни одно из них не работает.

Ответ №1:

Наконец-то я знаю первопричину и знаю, как ее устранить. Мне нужно установить высоту div, который использует cdkDropList.

Это пример решения задачи стекблитца.

Хотя я исправил проблему с неправильным положением, но я все равно хочу, чтобы полоса прокрутки отображалась в div, который я хотел, а не в div cdkDropList.