Changing model values when dragging using angular dragular

Question

I am working on sample projects using dragula as well as it's successor dragular.

I have a question regarding the usage of this. I implemented drag and drop with this project in angular. My question is :- I am using a list of objects as my model, which I set in the div using ng-repeat. When I drag an item o another div, is it possible to change/modify some property of the object that I dragged ?

I tried ways to get the model of the moving object, but failed. Hope someone have found a solution for this.

Answer 1

In dragular, you can access mirror DOM element via service 'dragularService.shared.mirror' and change whatever you want.

EDIT: I have noticed you mentioned modifying object which is dragged, you can access it too via service: 'dragularService.shared.sourceModel'

Answer 2

I had a similar problem and solved it by setting the id of the model objects on the HTML elements and accessing them through this id.

HTML snippet:

<div id="{{ user.id }}" ng-repeat="user in users">{{user.name}}</div>

In the controller I look up the item using the id:

$scope.$on('bag.drop', function (e, el, target, source) {
    //getById is a function you implement (unless you already have it)
    var userBeingDropped = users.getById(el.attr('id'));

    //Change the model object
    userBeingDropped.name = 'My new username';
});