angular-material - 角度拖放 : Items should not remove from container after drag and dropped

Question

我正在使用 Angular 拖放 CDK:

我能够将项目从一个容器拖放到另一个容器，反之亦然。现在，我试图不从容器中移除掉落的元素，但它应该掉落到另一个容器中。

正如您在图片中看到的，我想从 “回家”拖动一个项目'待办” 容器到“完成” 容器。

我想在掉落后保留一个项目。

示例: https://stackblitz.com/angular/bypeyxpbvxe?file=src%2Fapp%2Fcdk-drag-drop-connected-sorting-example.html

任何帮助，请...

Answer 1

这很容易。只需使用 copyArrayItem 而不是 transferArrayItem

import {
  CdkDragDrop,
  copyArrayItem,
  moveItemInArray
} from '@angular/cdk/drag-drop';

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