Dragula: return fall to ng2-dragula

Question

I have an angular2 application with typescript . I use ng2-dragula to make a drag and drop application.

I need to check the condition and return the resistance if the condition is false , and I know from here that revertOnSpill , that revertOnSpill:true can return the element to the first place.

But, I do not know how this is possible in ng2-dragula . I have included it in 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 } 

and here is the html code:

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

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

The problem is that I do not know how to cancel the fall?

Answer 1

There is a property called boolean move that controls if an element is moving or not.

 this.dragulaService.setOptions('second-bag', { moves: (el, container, handle) =>{ if(YourCondition) //return true; else //return false; }))