Angular 角垫拖放检测何时停止在div上拖动

Angular 角垫拖放检测何时停止在div上拖动,angular,drag-and-drop,angular-material,Angular,Drag And Drop,Angular Material,我使用的是角度材质拖放,我有两个列表,比如文档中的拖放示例。我希望能够将其中一个项目拖到两个div中的一个上,然后快速返回到原始列表,但检测它拖到了哪个div上。我尝试使用material dragEnded函数,但它只提供X和Y坐标。是否仍要获取项目拖过的div的id <div class="example-container"> <h2>To do</h2> <div cdkDropList #todoList="cdkDr

我使用的是角度材质拖放,我有两个列表,比如文档中的拖放示例。我希望能够将其中一个项目拖到两个div中的一个上,然后快速返回到原始列表,但检测它拖到了哪个div上。我尝试使用material dragEnded函数,但它只提供X和Y坐标。是否仍要获取项目拖过的div的id

<div class="example-container">
  <h2>To do</h2>

  <div
    cdkDropList
    #todoList="cdkDropList"
    [cdkDropListData]="todo"
    [cdkDropListConnectedTo]="[doneList, div1, div2]"
    class="example-list"
    (cdkDropListDropped)="drop($event)">
    <div class="example-box" *ngFor="let item of todo" cdkDrag>{{item.value}}</div>

</div>
</div>

<div class="example-container">
  <h2>Done</h2>
  <div
    cdkDropList
    #doneList="cdkDropList"
    [cdkDropListData]="done"
    [cdkDropListConnectedTo]="[todoList,  div1, div2]"
    class="example-list"
    (cdkDropListDropped)="drop($event)">
    <div class="example-box" *ngFor="let item of done" cdkDrag (cdkDragEnded)="dragEnded($event)">
      {{item.value}}
    </div>
  </div>
</div>
<br />
<br />
<div cdkDropList
     #div1="cdkDropList"
     [cdkDropListConnectedTo]="[doneList]"
     style="background-color: red; width: 300px; height: 100px"
     id="div1"
>Div 1</div>
<br />
<div cdkDropList
     #div2="cdkDropList"
     [cdkDropListConnectedTo]="[doneList]"
     style="background-color: red; width: 300px; height: 100px"
     id="div2"
>Div 2</div>

做
{{item.value}}
多恩
{{item.value}}


第一组
第2组
在事件中
(cdkdroplistdroped)=“drop($event)
您有一个事件

event.container.data
event.currentIndex
中,您拥有了“数据”,您可以添加一个“傻瓜数据”
[cdkDropListData]=“'one'”
[cdkDropListData]=“'two'”,并创建一个

drop(event: CdkDragDrop<string[]>) {
    if (event.previousContainer === event.container) {
      moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
    } else {
       if (event.container.data=='one'){...}
       if (event.container.data=='two'){...}
    }
  }
drop(事件:CdkDragDrop){
if(event.previousContainer==event.container){
moveItemInArray(event.container.data、event.previousIndex、event.currentIndex);
}否则{
如果(event.container.data='one'){…}
如果(event.container.data='two'){…}
}
}

如果您有真实的数据-一个数组,您可以使用
If(event.container.data==myarrayOne)

我以前回答过类似的问题,请遵循以下步骤