ngx-bootstrap bs-sortable shows prevously dragged item when a menu item is dragged to the sortable section

Question

Once an item is dragged from the bs-sortable section it's stored in the cache and whenever an outside element for eg: a menu is dragged the previously dragged item appears in the sortable section.

Find more info from the gif provided :

https://lh3.googleusercontent.com/-ztVT2dV-Z4g/Xc5k5syOL2I/AAAAAAAAKeI/KmfvezqDx4425kTLr6TgHpFilX90fSF4wCK8BGAsYHg/s0/2019-11-15.gif

here is the original link:

https://valor-software.com/ngx-bootstrap/#/sortable

any idea how to fix this...

Thanks in advance.

Answer 1

I just fixed the above-mentioned issue. Here is the code if anyone is looking for the answer.

Go to node_modules and Edit the sortable.component.js file in the location :
node_modules/ngx-bootstrap/sortable/sortable.component.js

Add a flag variable inside the function as shown below,

function SortableComponent(transfer) {
  ...
  this.itemFlag = false;
  ...
 }
 SortableComponent.prototype.onItemDragstart = function (event, item, i) {
  this.itemFlag = true;
  ...
};
SortableComponent.prototype.onItemDragover = function (event, i) {
  if(!this.itemFlag){
      return;   
  }
  ...
};

SortableComponent.prototype.writeValue = function (value) {

  this.itemFlag = false;
  ...
};

This Solved my issue !!.