如何单击ng-grid表中的按钮从模型中删除一行？

Question

我用ng-grid设置了以下内容:

    var gridData = {};
    $scope.gridOptions = {
        data: 'gridData',
        enableCellEdit: true,
        multiSelect: false,
        columnDefs: [
            { field: 'testId', displayName: 'Test Id' },
            { field: 'name', displayName: 'Name', enableCellEdit: true, editableCellTemplate: cellEditableTemplate },
            { field: 'description', displayName: 'Description', enableCellEdit: true, editableCellTemplate: cellEditableTemplate },
            { field: '', cellTemplate: '<button ng-click="delete(row)">Delete</button>' }
        ]
    };

和:

   $scope.delete = function (row) {
      row.entity.$deleteData({ testId: row.entity.testId });
   }

这会将HTTP消息发送到删除该行的服务器.但是该行仍然保留在网格中.我怎么能这样做,所以单击行上的删除按钮也会从gridData对象中删除一行？

Answer 1

就像Valentyn Shybanov在他的评论中提到的那样,你应该检查服务器是否成功删除了数据库中的对象,然后将其从gridData数组中删除.

$scope.delete = function(row) {
    row.entity.$deleteData({testId:row.entity.testId})
        .then(function(response) {
            if (response.status === 'OK') {
                remove($scope.gridData, 'testId', row.entity.testId);
            }
        });
}

// parse the gridData array to find the object with testId
function remove(array, property, value) {
    $.each(array, function(index, result) {
        if (result[property] == value) {
            array.splice(index, 1);
        }
    });    
});

"删除功能"取自:https://stackoverflow.com/a/6310763/1036025