CODEWITHSUNDEEP
angulartypescriptdraggabledragulang2-dragula
Roman Baida
Roman Baida

Reputation: 51

Angular 2 - ng2-dragula

<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>

I have few columns. Every column contain array with tickets. How can I detect which ticket moved and where?

Upvotes: 0

Views: 407

Answers (1)

CharanRoot
CharanRoot

Reputation: 6335

Add id to your dragula Div. In your case use 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 event.

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

step 3
on the on the onDrag(value) function args are el, target, source, sibling

value[1] ==> target.id value[2] ==> source.id based on the id you can detect ticket moved between columns

Upvotes: 1

Related Questions