Angular 2- ng2-dragula

Question

<column *ngFor="let col of columns">
  ...
  <div [dragula]="'tickets-list'" [dragulaModel]="col.tickets">
    <ul>
      <li *ngFor="let ticket of col.tickets">
        {{ ticket }}
      </li>
    </ul>
  </div>
</column>

我有几个专栏。每一列都包含带有票证的数组。怎样才能检测出是哪张票被移到了哪里？

Answer 1

添加id到你的dragula Div。在您的示例中，使用col.id

step -1

  <div  id={{col.id}}  [dragula]="'tickets-list'" [dragulaModel]="col.tickets">
        <ul>
          <li *ngFor="let ticket of col.tickets">
            {{ ticket }}
          </li>
        </ul>
      </div>

step 2 subscribe drop事件。

 dragulaService.drop.subscribe((value) => {
                this.onDropModel(value.slice(1));
            });

步骤3

在onDrag(值)函数上，参数是el、target、source、sibling

value1 ==> target.id value2 ==> source.id基于您可以检测在列之间移动的票证的id