我有一个angular2应用程序，typescript .我正在使用ng2-dragula来制作拖放应用程序。
我需要检查一个条件，如果条件为假，则恢复拖动，我从这里知道，revertOnSpill revertOnSpill:true可以将元素放回其首位。
但是，我不知道这怎么可能在ng2-dragula. 我在onDrop中暗示了它.这是代码
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 是：
"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"
}
问题是，我不知道如何取消掉落？
有一个属性叫做布尔移动，它控制一个元素是否可移动
this.dragulaService.setOptions('second-bag', {
moves: (el, container, handle) =>{
if(YourCondition)
//return true;
else
//return false;
}))
我知道
它的旧帖子，但如果有人在搜索这个。如果要使用本机 Dragula 事件来还原丢弃。以下代码段可以帮助您将最后一个删除区异步还原到其先前的位置。在这里，当拖动开始时，我们将父级和父级同级详细信息保存在全局变量中。然后在删除时使用这些详细信息异步还原它
var originalParent, originalNextSibling;
drake.on('drag', function (el, source) {
// Store the original parent and next sibling of the dragged element
originalParent = el.parentNode;
originalNextSibling = el.nextElementSibling;
});
drake.on('drop', function (el, target, source, helper) {
setTimeout(function () {
// move back the card
if (originalNextSibling) {
originalParent.insertBefore(el, originalNextSibling);
} else {
originalParent.appendChild(el);
}
}, 2000);
});