Как ограничить элемент перетаскивания между одной границей в Angular Material 7 CDK?
Для моего текущего проекта я пытаюсь реализовать элемент перетаскивания из одной позиции в другую позицию внутри одного div. Для этого я использую перетаскивание в Angular Material 7 CDK. это перетаскивание по всей странице, но вы хотите перетащить только внутри определенного div. Но я не видел никакой возможности управлять границей в Angular Material 7 CDK drag and drop.
Может кто-нибудь сказать мне, как контролировать границу в материале или предложить какие-то другие плагины, которые можно скомпилировать для угловых 7.?
Благодарю.
2 ответа
Ты можешь использовать cdkDragBoundary что будет полезно для предотвращения перетаскивания пользователем элемента за пределы другого элемента.
Вы можете использовать его следующим образом:
<div class="example-boundary">
<div class="example-box" cdkDragBoundary=".example-boundary" cdkDrag>
I can only be dragged within the dotted container
</div>
</div>
Подробнее об этом можно прочитать здесь. Угловой материал Ограничение движения внутри элемента.