Ng2-Dragula：在运行时启用拖动

Question

所以，我有以下模板。

<div dragula="'card-images'" [dragulaModel]="images">
  <child-component [card]="imageCard" [ngClass]="cssClass(card)" *ngFor="let imageCard of images"></child-component>
</div>

函数 cssClass 根据 imageCard 的类型设置类。所以根据图片卡片的类型设置为可拖动和不可拖动。现在，我希望子组件只有在其属性 isSelected 仅在长按后才为 true 时才可拖动，并且这是动态完成的。我怎样才能做到这一点？如何让子组件在运行时可拖动？

谢谢。

Answer 1

您可以提供moves 功能，并在项目应可拖动时设置条件。

在你的情况下，你可以做两步 -

1。将类添加到基于属性的元素中。

<child-component [ngClass]="{'no-drag' : card.selected != true}"></child-component>

2。如果没有类no-drag，则拖动元素。

  constructor(private dragulaService: DragulaService) {
      dragulaService.setOptions('card-images', {
        moves: (el, source, handle, sibling) => !el.classList.contains('no-drag')
      });
    }