无法丢弃 Angular Material 丢弃物品

Question

我正在尝试 Angular Material cdkDragDrop。

试图从嵌套对象填充列表。我能够显示列表，但是在尝试移动某个项目时，它没有出现在 'Added Details' 列表

中

代码：https://stackblitz.com/edit/angular-awxclk?file=src%2Fapp%2Fcdk-drag-drop-connected-sorting-example.html

Answer 1

在您的代码中，您使用的是 moveItemInArray 和 transferArrayItem，它们期望（顾名思义）第一个参数是一个数组。在您的情况下，您将它指向一个对象，因此该方法会在内部抛出。

您想要做的是在两个容器中使用实际集合作为 [cdkDropListData]。然后，您在 *ngFor 指令中迭代这些相同的集合。

因此，在您的 constructor / onInit 中，您将对象转换为数组并将该数组用作 [cdkDropListData]。然后，如果您愿意，可以将数组转换回对象并在 drop 方法结束时更新它。