#javascript #html #angular #drag-and-drop #angular-cdk
#javascript #HTML #angular #перетаскивание #angular-cdk
Вопрос:
Мои требования требуют скрытия cdkDropList , пока пользователь не начнет перетаскивать элемент. Поэтому, когда пользователь начинает перетаскивать элемент, выпадающие списки становятся видимыми, и они начинают их получать.
Я достигаю этого, установив display none в CSS, как показано ниже.
.drop {
display: block;
}
// this makes the drop element display: none until you start dragging (angular adds the class .cdk-drop-list-dragging when drag is started)
.drop(:not(.cdk-drop-list-receiving):not(.cdk-drop-list-dragging)) {
display: none;
}
Однако это не работает, и cdkDropList элементы не получат мои элементы.
Если я удалю display: none; и сделаю вместо visibility: hidden; этого, это сработает. Проблема в том, что мне нужно, чтобы он не занимал место в DOM. (Я перепробовал все подходы, такие как position: absolute, и все, что перемещает / удаляет элемент, предотвратит его удаление после отображения).
Любая помощь приветствуется. Спасибо!
Комментарии:
1. Можете ли вы установить ширину и высоту равными 0 перед началом перетаскивания? Он все еще находится в DOM, но не выполняется.
2. Та же проблема. Похоже, эта проблема заключается в том, что dom зависает с точки зрения удаления. поэтому, если ширина и высота равны 0, некуда выполнить dop для