angular - cdkDrag drop 后如何获取位置？

Question

您好，我需要能够拖放一些 html 元素，但我需要知道拖放的结束位置。

使用我从 docs 中看到的 cdkDrag 指令有一个事件 cdkDragEnded。

这是我的模板:

<div cdkDrop>
  <div cdkDrag (cdkDragEnded)="dragEnd($event)">
    ...other stuff
  </div>
</div>

回调是:

dragEnd(event: CdkDragEnd) {
  console.log(event);
}

在控制台中我找到了我需要的东西，但它是事件 event.source._dragRef._passiveTransform 的私有(private)属性，我在编译时收到错误消息。

你知道这些数据或我可以使用的其他东西是否以某种方式暴露了吗？

Answer 1

只需在 (getFreeDragPosition) 事件中使用 source.getFreeDragPosition()，如下所示:

dragEnd($event: CdkDragEnd) {
    console.log($event.source.getFreeDragPosition());
}