使用dnd-draggable创建的重复卡，如何解决？

Question

我有一个固定尺寸卡的仪表板（4）。每当我将任何一张卡转移到另一个位置时，在仪表板中创建了同一张卡的复制品。现在我总共有5张卡片。如果我这样做，它将再次创建重复。我的目标只是将卡片移动到另一个位置而不重复。

在html文件中

  <div class="card" 
        ng-repeat="card in dashCtrl.cards track by $index"
         dnd-draggable="card" 
         dnd-type="'card'" 
         dnd-effect-allowed="move"
         dnd-moved="dashCtrl.updateCardPosition($index)"
         dnd-dynamic-placeholder-size="true" ng-include="'/partials/dashboard/'+card.template+'.html'">
  </div>

这里dashCtrl == dashboard_controller

在仪表板控制器中。

function updateCardPosition($index) {
            // if(vm.cards.length!=4)validEntry();
            // vm.cards.splice($index, 1);
            console.log('dsdsdsdsds',$index);

            vm.cards = _.uniqBy(vm.cards,'template');
            vm.cards.forEach((ele)=>{
                console.log('xxxxxxxxxxxxxx',ele);  
            });
            // console.log("cards",vm.cards.length);
            // console.log('index',$index);
            Store.set('cards', JSON.stringify(vm.cards));
        }

这里vm是控制器的对象（this），它有很多方法。所以vm.cards是一组卡片。我使用Store（用于本地存储）来存储修改后的数组（就位置而言）。

vm.cards的结构

vm.cards = [
            {template: 'agenda-card'},
            {template: 'budget-card'},
            {template: 'collaborate-card'},
            {template: 'todo-card'}
        ];

我检查了谷歌的一切，但我找不到解决方案。我想重复问题可能来自dnd-draggable.I我只是在猜测。那么如何解决重复问题？

Answer 1

从track by $index删除ng-repeat="card in dashCtrl.cards track by $index"