简体   繁体   English

Angular 2-ng2-dragula

[英]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? 我如何检测哪张车票已移动到哪里?

Add id to your dragula Div. 将ID添加到您的Dragula Div。 In your case use col.id 在您的情况下,请使用col.id

step -1 第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. 步骤2订阅放置事件。

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

step 3 第三步
on the on the onDrag(value) function args are el, target, source, sibling 在onDrag(value)函数上,args是el,target,source,sibling

value[1] ==> target.id value[2] ==> source.id based on the id you can detect ticket moved between columns value [1] ==> target.id value [2] ==> source.id基于您可以检测到的列之间移动的票证的id

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM