Angularjs使用单个列表进行拖放

我在这个柱塞里有一个angular应用。

在这里，我试图实现一个拖放功能，只使用一个列表。

应用程序如下:

app.controller('MainCtrl', function($scope) {
  $scope.people = [
      {'id':'1' ,'name':'John','category':'m'},
      {'id':'2', 'name':'Jack','category':'m'},
      {'id':'3','name':'Mark','category':'m'},
      {'id':'4','name':'Ernie','category':'m'},
      {'id':'5','name':'Jane','category':'w'},
      {'id':'6','name':'Jill','category':'w'},
      {'id':'7','name':'Betty','category':'w'},
      {'id':'8','name':'Mary','category':'w'}
      ];

      $scope.addText = "";

      $scope.dropSuccessHandler = function($event,index,array){
          //array[index].category='w';
          //findAndRemove(array, id, pid);
      //    alert(index, array[index]);
          array.splice(index,1);
      };

      $scope.onDrop = function($event,$data,array){
         // $data.category='m';
         // $scope.people.splice($scope.people.indexOf($data.id), 1);
          $scope.people.push($data);
          //array.push($data);
      };
});

问题是，当我试图将元素从右放到左时，控制器会彻底混淆。splice命令正在删除错误的名称。当我们把一个元素从左移到右时，它可以正常工作。

我怎么绕过这个?