Question

我一直在寻找一个关于如何实现按钮来删除所选行的示例，但到目前为止我找不到任何有用的东西。

任何人都可以给我一个提示吗？这是plunker示例。

我实现的函数很奇怪，因为它删除了其他行。

谢谢。

Answer 1

这不是删除任何行的正确方法

试试这样：

$scope.removeRow = function() {
   var index = this.row.rowIndex;
   $scope.gridOptions.selectItem(index, false);
   $scope.myData.splice(index, 1);
};

PLUNKER -->其工作和测试

Answer 2

感谢提示但是我尝试了片段，它不起作用所以我在

中改了它

var removeTemplate = '<input type="button" value="remove" ng-click="removeRow()" />';
$scope.removeRow = function() {;
                    var index = this.row.rowIndex;
                    alert(index);
                    $scope.gridOptions.selectItem(index, false);
                    $scope.items.splice(index, 1);
                };

它就像一个魅力:) 希望这有帮助。

Answer 3

这可能会对您有所帮助，这也是为了删除网格中的多行。

$scope.mySelections = [];

$scope.gridOptions = {
    data :'gridData',
    selectedItems : $scope.mySelections,
    showSelectionCheckbox : true
}

$scope.deleteSelected = function() {
    angular.forEach($scope.mySelections, function(rowItem) { 
    $scope.gridData.splice($scope.gridData.indexOf(rowItem),1);
});
}

mySelections是已选择行的数组

Answer 4

一旦对数组进行排序，此问题的上一个答案将无法运行，因为row.index会根据数组的排序方式而更改，但数组中的原始数据仍保留在原始数据中指数。我们必须在数据数组中找到正确的索引才能删除正确的行。该行包含对row.entity中原始数据的引用，因此我们可以使用indexOf来查找正确的索引。

$scope.actionTemplate = '<input type="button" value="Delete" ng-click="delete($event);" />';

$scope.delete = function($event) {
    $event.stopPropagation(); //keep the row from being selected
    $scope.data.selectAll(false); //remove all selections: necessary for issues with the selection array
    var index = $scope.data.indexOf(this.row.entity); //get the correct index to splice
    $scope.metrics.splice(index, 1); //remove the element
};

编辑：原始解决方案可能当时有效，但ng-grid已经更新，不再有效。

Answer 5

它可能对你有帮助

<!doctype html>
<html ng-app="deleteApp">
<head>
  <title>Example - www.code-sample.com</title>
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.1/angular.min.js"></script>
  <script>
    angular.module('deleteApp', [])
      .controller('deleteController', ['$scope', function ($scope) {
          $scope.Rows = [
            { row: 'RowCount1'},
            { row: 'RowCount2'},
            { row: 'RowCount3'},
            { row: 'RowCount4'},
            { row: 'RowCount5'}];

            $scope.delete = function(index){
              $scope.Rows.splice(index, 1);
            }
      }]);
  </script>
</head>
<body ng-controller="deleteController">
  <div ng-repeat="ro in Rows">
    <div>{{$index + 1}} :  {{ro.row}} <input type="button" value="delete" ng-click="delete($index)" /></div>
  </div>
</body>
</html>

Answer 6

这有效：

showSelectionCheckbox：true - ＆gt;它将复选框添加到网格和 $ scope.delItem = function（） - ＆gt;它适用于多行或单行选择

     $scope.mySelections = [];
                 $scope.gridOptions = {
                     data :'data',
                     selectedItems : $scope.mySelections,
                     showSelectionCheckbox : true
                 } 

 $scope.delItem = function() {
      for (var i = 0; i < $scope.mySelections.length; i++) {
             var index = $scope.data.indexOf($scope.mySelections[i]);
             if (index != -1) {
                 $scope.data.splice(index, 1);
             }
         }
     }

ngGrid - 删除行

6 个答案: