Есть ли способ сделать компоненты (не элементы) перетаскиваемыми под углом?

Question

Я использую модуль перетаскивания Angular CDK, он хорошо работает с HTML-элементами, такими как div, p и тому подобное. но по какой-то причине, когда я помещаю директиву cdkDrag в компонент, она не работает.

<!-- WORKS -->    
<div cdkDrag>content</div>    

<!-- DOESNT WORK -->
<my-component cdkDrag></my-component>

еще одна вещь, которую я заметил, это то, что каждый компонент в angular имеет ширину и высоту, установленные на auto (в основном 0x0), если я не отредактирую CSS и не добавлю display: block к стилю компонента

Answer 1

Компонент - это пользовательский тег.В браузере это рассматривается как «неизвестный» тег и имеет значение по умолчанию inline.Это также приведет к тому, что размеры будут равны 0x0, если вы добавите туда блочные элементы.

Чтобы преодолеть это, вы должны сделать это display: block или inline-block или flex (или что вам подходит)это также перетаскивается.Вы можете создать глобальный класс, если это не нарушает компоновку остальных ваших перетаскиваемых объектов:

.cdkDrag {
  display: inline-block;
}