Dragula:还原ng2-dragula中的下降 [英] Dragula :revert drop in ng2-dragula

问题描述

我有一个带有typescript的angular2应用程序.我正在使用 ng2-dragula 制作拖放应用程序.

i have an angular2 app with typescript. I am using ng2-dragula to make a drag and drop application.

我需要检查条件，并在条件为假的情况下还原拖动，而且我从此处，即revertOnSpill表示revertOnSpill:true可以将元素放回其第一位.

I am requiered to, check a condition, and revert the drag if the condition is false, and I know from here, that revertOnSpill that revertOnSpill:true can put the element back to its first place.

但是，我不知道怎么可能 ng2-dragula. 我将其隐含在onDrop中.这是代码

But, I don't know how is it possible in ng2-dragula. i implimented it in the onDrop. here is the code

 constructor() {

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

                dragulaService.setOptions('second-bag', {
                  removeOnSpill: true
              });
 }

private onDrop(args) {
   bla
   bla
   bla
   if(err.status=="404")                                                               
          this.dragulaService.removeModel;
         // this.dragulaService.cancel; also tried but did not work   
}

这是html代码:

<div   id="toPlay" class="playBox roundedBox" [dragula]="'second-bag'">
    <img class="w3-animate-top" [src]="sax_path" alt="sax" id="saxsophone"/>
    <img class="w3-animate-top" [src]="drum_path" alt="drum" id="drum"/> 
</div>
<div   id="scene"  [dragula]="'second-bag'">

</div> 

Package.json是:

Package.json is:

 "dependencies": {
    "dragula": "^3.7.2"
  },
  "peerDependencies": {
    "@angular/common": "^2.0.0",
    "@angular/core": "^2.0.0",
    "@angular/compiler": "^2.0.0",
    "@angular/forms": "^2.0.0"
  },
  "devDependencies": {
    "angular-cli": "1.0.0-beta.22-1",
    "typescript": "2.0.10"
  }

问题是，我不知道如何取消掉钱?

推荐答案

有一个名为boolean的属性

There is a property called boolean moves, which controls iff an element is movable or not

this.dragulaService.setOptions('second-bag', {

        moves:  (el, container, handle) =>{

                             if(YourCondition)
                                     //return true;
                             else
                                     //return false; 
                         }))

这篇关于Dragula:还原ng2-dragula中的下降的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！