angular-dragdrop:如何在项目被删除后清空掉落区域?

时间:2015-05-05 08:49:38

标签: javascript angularjs drag-and-drop angular-dragdrop

情况:

大家好。在我的应用程序中,我有一个表格内显示的项目列表。

我正在使用angular-dragdrop将这些项目拖到垃圾箱并删除它们。

一切正常:在我将项目放在bin上之后,该函数被触发并且该项目被删除。

但是有一个问题:删除项目后,将刷新项目列表。但是发生的事情是物品仍然在掉落区域。由于删除的项目不是列表的一部分,因此以下项目取而代之..

此项目应显示在列表中,而不是显示在放置区域上。

代码:

<tr ng-repeat="item in list_items track by $index">

     <td>
        <span data-drag="true" data-jqyoui-options="{revert: 'invalid'}" jqyoui-draggable="{index: {{$index}}, onStart:'set_item_id_to_drag({mail_id: email.mail_id})'}">
        <a > {{item.name}} </a>
        </span>
    </td>

 </tr>

<span data-drop="true" data-jqyoui-options jqyoui-droppable="{onDrop:'email_dragged_delete()'}">
    BIN
</span>


$scope.email_dragged_delete = function( event, ui )
{
   var item_id = $rootScope.item_id_to_drag.item_id;
    $http({

        url: base_url + 'api/item_delete',
        data: { item_id: item_id },
        method: "POST",

     }).success(function (data) {

        delete $rootScope.email_id_to_drag;

        var result = ItemsService.list_items( $stateParams.mail_account_id );
        result.then( function( data ) {

            $rootScope.list_items = data;

        });

     });

}

$scope.set_item_id_to_drag = function( event, ui, item_id )
{
    $rootScope.item_id_to_drag = item_id;
}

问题:

是否可以在拖动元素并触发事件后清空放置区域? 那么为了避免列表中的另一个元素取而代之?

非常感谢!

0 个答案:

没有答案