ngGrid - supprimer la ligne

J'ai été à la recherche pour un exemple sur la façon de mettre en œuvre un bouton pour supprimer une ligne sélectionnée, mais je ne pouvais pas trouver quelque chose d'utile à ce jour.

Quelqu'un peut me donner un indice? Voici la plunker exemple.

La fonction que j'mettre en œuvre des actes étranges, qu'il supprime les autres lignes.

Merci.

OriginalL'auteur oblivion19 | 2013-06-28

  1. 18

    Qui n'est pas une bonne façon de supprimer toute ligne

    Essayer comme ceci:

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

    PLUNKER --> Son travail et testé

    Eh bien, essayez et supprimer Moroni et vous verrez qu'il supprime la dernière ligne. Donc, fondamentalement, il supprime la dernière ligne chaque fois (semblable à de la pop pour la file d'attente).
    Hey Dado, j'ai trouvé le problème. C'est avec l'argument que j'envoie à travers mon bouton, qui était $index. Si vous changer cela en "ligne", il fonctionne correctement. Je vous remercie pour votre réponse mate.
    ohh... ouais... c'est ça.. Content, il a aidé 🙂
    Ressemble à la plunker ne fonctionne pas
    vous plnkr ne fonctionne pas tout le temps. Si vous appuyez sur le nom d'en-tête de l'ordre des entrées à l'inverse; Appuyez sur n'importe quel bouton supprimer, puis l'entrée qui était sur la ligne précédente pour frapper l'en-tête sera supprimé puisque vous retirez $champ d'application.madate fondée sur la valeur actuelle de l'indice!

    OriginalL'auteur Dhaval Marthak

  2. 6

    merci pour l'astuce mais
    J'ai essayé l'extrait de code et ça ne fonctionne pas
    alors je l'ai changé en

    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);
                };

    et il fonctionne comme un charme 🙂
    Espérons que cette aide.

    Fonctionne pour moi! Remarque - Si vous avez enableCellEditOnFocus: true pour la grille, vous devez définir les deux cellTemplate: removeTemplate et editableCellTemplate: removeTemplate sur le columnDefs. Sinon, la cellule s'affiche modifiable

    OriginalL'auteur Whisher

  3. 3

    Ce qui pourrait vous aider, et aussi c'est pour la suppression de plusieurs lignes dans la grille.

    $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 est le tableau qui a choisi les lignes

    OriginalL'auteur user3338676

  4. 2

    Précédente réponse à cette question ne fonctionne pas une fois que le tableau a été trié car la ligne.index des modifications basées sur la façon dont le tableau a été trié, mais les données d'origine dans le tableau reste dans l'état initial de l'indice. Nous devons trouver le bon indice dans le tableau de données afin de supprimer la ligne correcte. La ligne contient une référence à l'origine des données en ligne.entité afin que nous puissions utiliser indexOf pour trouver le bon indice.

    $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
};

    Edit: La solution d'origine peuvent avoir travaillé à l'époque mais ng-grille a depuis été mis à jour et il ne fonctionne plus.

    Super Réponse! Les autres solutions ne fonctionnent pas si vous souhaitez supprimer une seule entrée une fois que vous changez la façon dont les données sont triées ou ajouter une option de recherche

    OriginalL'auteur Alex L

  5. 0

    Il pourrait vous aider à

    <!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>

    OriginalL'auteur Anil Singh

  6. 0

    Cela fonctionne:

    showSelectionCheckbox : vrai ->il ajoute une case à cocher sur la grille
    et
    $champ d'application.delItem = function() -> il fonctionne aussi bien sur plusieurs lignes ou une ligne unique de sélection

         $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);
             }
         }
     }

    OriginalL'auteur Tilak Patil