We're using the copy: true
setting with ng2-dragula
:
constructor(private dragulaService: DragulaService) {
dragulaService.setOptions('group-body-bag', {
copy: true,
copySortSource: true
});
}
Now we want to fade out the original element (the one that is still sitting in the list while we are dragging) with something like opacity: 0.3
. How can we do that? Using
dragulaService.cloned.subscribe((value) => {
if (value && value.length && value.length === 4 && value[3] === 'copy') {
this.onDragCopy(value[1]);
}
});
we can find the original element and we could apply a transparancy to it, bit this seems awfully wrong: The draggable elements (naturally) come from a data-array, is there a way to find the dragged element's index so we can do something like
dragulaService.cloned.subscribe((index) => {
this.draggedElement = index;
});
and
<li *ngFor="let article of articles; let i = index"
[class.original-dragged-element]="draggedElement === i">
(I know, this is bad already, I should match article).
I have decided that the Angula way is to manipulate data and have a template render the classes.