时间戳

首页 > 解决方案 > 获取被删除元素的名称和ID

angular - 获取被删除元素的名称和ID

问题描述

我正在使用 cdk 拖放库来拖放对象。

我的问题是我无法获取拖放对象的数据（对象信息：名称和 ID）。

我试过使用console.log (event.item.data)，但它给出了未定义的。

有谁知道我如何获取有关已删除元素的信息？

谢谢

Stackblitz - 演示

.ts

 drop(event: CdkDragDrop<string[]>) {
    console.log(event.item.data)
    if (event.previousContainer === event.container) {
      moveItemInArray(
        event.container.data,
        event.previousIndex,
        event.currentIndex
      );
    } else {
      transferArrayItem(
        event.previousContainer.data,
        event.container.data,
        event.previousIndex,
        event.currentIndex
      );
    }
  }

html

<div class="six" style=" height: 75%;">
  <div class="card-deck cardsZone">
    <div class="card myCards">
      <div class="card-body" style="overflow-y: auto;"  #activeList="cdkDropList"
      class="box-list" style="height:100%"
      cdkDropList
      cdkDropListOrientation="vertical"
      [cdkDropListData]="A"
      [cdkDropListConnectedTo]="[inactiveList]"
      (cdkDropListDropped)="drop($event)">
        <div *ngFor="let nw of A" cdkDrag>
        <div class="card mysmallCcards">             
          <div class="card-body">
                   <span>{{nw.name}}</span>         
          </div>
        </div>
        </div>
      </div>
    </div>
    <div class="card myCards">
      <div class="card-body" style="overflow-y: auto;" #inactiveList="cdkDropList"
      class="box-list" style="height:100%"
      cdkDropList
      cdkDropListOrientation="vertical"
      [cdkDropListData]="B"
      [cdkDropListConnectedTo]="[activeList]"
      (cdkDropListDropped)="drop($event)">
        <div *ngFor="let pr of B" cdkDrag>
        <div class="card mysmallCcards">
          <div class="card-body">
           <span>{{pr.name}}</span>
          </div>
        </div>
        </div>
      </div>
    </div>
  </div>
</div>

标签： angulartypescriptdrag-and-dropangular-materialangular-cdk

解决方案

试试这个：

event.previousContainer.data[event.previousIndex]

如果你想要项目的 id：

event.previousContainer.data[event.previousIndex]['id]

推荐阅读