Angular table-sort and drag and drop table row conflict

Question

I am using angular table-sort and angular drag-drop in my project. When I am dragging a row and trying to drop it to another row, then table sort forcefully sort the rows to their previous position.

If I remove the table sort directive ts-repeat, then drag and drop works perfectly. I also need default table column sorting "Age" ascending. I have made an example on plunker for better understanding. https://plnkr.co/edit/pHlTufpayFAB4he8bN6y

So, how to prevent table-sort when drag and dropping a row?

Can anyone help me solving this issue? I would really appreciate this. Thanks in advance.

Answer 1

I think you should just get rid of ts-repeat, and only sort the data initially (in your service/controller). It's not a bug, it's a feature. Imagine, that you remove and then re-add an element to a table, which is sorted. You want it to keep sorted, right?

Answer 2

You can try by using Angular ui-sortable instead of angular drag-drop. I think it will work for you.