Açısal JS UI-Grid Sil Satır

Question

ui-grid ürününe yeni kayıt yapıyorum ve aşağıdaki resimde gösterildiği gibi AngularJS'de bir tablo uygulamaya çalışıyorum. Bir satır seçmeye çalışıyorum ve o satırdaki silme tuşunu kullanarak siliyorum. ui-grid belgeleri, gridApi'u kullanmamızı gerektirir, ancak bunlar için yeterli belge bulamıyorum.

Answer 1

Sadece ek yeri kullanılarak ui-ızgaralar veri kaynağı modelinden silmek istediğiniz satırı kaldırın. Örneğin

$scope.myGridOptions.data.splice(<YOUR ROW INDEX HERE>, 1); 

Answer 2

burada bir satır silmek için nasıl bir çalışma örnek bakınız. http://plnkr.co/edit/6TiFC6plEMJMD4U6QmyS?p=preview

anahtarı dinamik olarak güncellenen almaz gibi row.index dayanarak indexOf(row.entity) değil kullanmaktır.

$scope.deleteRow = function(row) { 
    var index = $scope.gridOptions.data.indexOf(row.entity); 
    $scope.gridOptions.data.splice(index, 1); 
}; 

---

Jenerik yaklaşım

function deleteRow(row,grid) { 
    var i = grid.options.data.indexOf(row.entity); 
    grid.options.data.splice(i, 1); 
} 

Answer 3

Biz $ scope.grid.appScope kullanmak gerekir. Tüm şablonlarda mevcuttur. Bunun yanı sıra, satır nesnesini şablondan göndermeniz gerekir, böylece satırları ızgara verilerinden silebilirsiniz.

jsfiddle: Burada sağlanan http://jsfiddle.net/3ryLqa9e/4/

cellTemplate:'<button class="btn primary" ng-click="grid.appScope.Delete(row)">Delete Me</button>' 

    $scope.Delete = function(row) { 
      var index = $scope.gridOptions.data.indexOf(row.entity); 
      $scope.gridOptions.data.splice(index, 1); 
     }; 

Answer 4

diğer çözümler (çünkü ui-ızgaranın benim son farklı versiyonu olabilir) benim için çalıştı olmadı. Yani kapsam dizisinden eleman çıkarmak benim için çalıştı. Bu, ui-grid'in diğer sürümleriyle bile çalışmalıdır, çünkü veri değiştiğinde grid güncellenmelidir. (Açısal sayesinde !!!) Burada diziden eleman çıkarmak ve lodash kullanıyorum

örnek kod:

$scope.deleteRow = function(row){ 
    _.remove($scope.gridData, { 
     id: row.id 
    }); 
}; 

Answer 5

Sen yeni API adapte kadarıyla @Blousie çözümü kullanabilirsiniz

: "Grid.appScope.edit (row.entity)", kapsamınızın "düzenleme" işlevine erişebilmenizi sağlar. Böyle

şey:

var removeTemplate = '<button class="btn btn-danger" ng-click="grid.appScope.removeRow(row)"><i class="glyphicon glyphicon-remove"></i></button>'; 

$scope.removeRow = function(row) { 
    var index = $scope.<yourDataModelProperty>.indexOf(row.entity); 
    if (index !== -1) { 
     $scope.<yourDataModelProperty>.splice(index, 1); 
    } 
};