如何使用cdkDropListEnterPredicate检查多个条件？

Question

我有多个拖拽列表连接到多个拖放区域，但需要限制哪些项目可以拖动基于应用程序中已经设置的变量。例如，如果我有以下内容：

this.maxVirtuePts = 10;
this.reqSocialStatus = false;
this.allowedTheGift = true;
this.maxHermeticMajorVirtue = 1;

对于maxVirtuePts，如何将drop区域中的项目数量限制为10？对于reqSocialStatus，如何检查放置区域中是否至少存在一个项目？对于allowedTheGift，如何检查拖放项目的名称是否包含特定文本？对于maxHermeticMajorVirtue，如何检查从特定列表中删除的项目是否已经存在，以避免添加来自同一来源列表的其他项目？

如果任何人能就如何有效地使用cdkDropListEnterPredicate提出建议或提供示例，将不胜感激。

增加了一个StackBlitz：https://stackblitz.com/edit/angular-flpx5t

Answer 1

在drop函数中，您可以检查任何您想要的条件，如果条件不满足，只需调用return，这将停止将项目放入区域

例如

drop(event: CdkDragDrop<string[]>) {
    if(event.container.data.length>9){
     return // this will stop item from drop
    }
    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
      );
    }
  }

Answer 2

我最终使用了cdkDropListEnterPredicate，但只有最后的检查会阻止更多的项目被传输。为了进行最终检查，我将其他条件作为变量进行了计算。