Jak ukryć określone wiersze w tabeli ui na podstawie jej wartości?

Question

Mam proste siatki UI z tych opcji:

$scope.transactionGrid = { 
    enableSorting : true, 
    enableColumnResize : true, 
    enableScrollbars : true, 
    enablePaginationControls : false, 
    minRowsToShow : 6, 
    onRegisterApi : function(gridApi) { 
     $scope.gridEventsApi = gridApi; 
    } 
}; 

chcę ukryć wiersze, które mają określoną wartość, deleted: "y".

$scope.transactionGrid.data = [ 
    { Name: "First", deleted: "y" }, 
    { Name: "Second", deleted: "y" }, 
    { Name: "Third", deleted: "n" }, 
    { Name: "Fourth", deleted: "n" } 
]; 

Bez faktycznej zmiany danych, czy można je odfiltrować z rzędów?

Answer 1

Jednym ze sposobów jest dostosowanie szablonu repeater-wiersz w celu sprawdzenia wartości określonej dla wiersza i sprawienie, by wiersz pokazywał/ukrywał w ten sposób. Utworzono a Plunkr przedstawiające możliwe rozwiązanie.

Najpierw trzeba stworzyć swój wiersz wartość sprawdzania funkcji:

appScopeProvider: { 
    showRow: function(row) { 
    return row.deleted !== 'y'; 
    } 
}, 

Wtedy dostosowania ich szablon dodając ten czek z ich kolejnością-repeater

$templateCache.put('ui-grid/uiGridViewport', 
    ... 
    ng-if=\"grid.appScope.showRow(row.entity)\" 
    ... 
} 

Answer 2

Można go ukryć tworząc szablony komórek i ukrywając je w oparciu o wartość wiersza dla każdego pola:

$scope.transactionGrid = { 
    enableSorting : true, 
    enableColumnResize : true, 
    enableScrollbars : true, 
    enablePaginationControls : false, 
    minRowsToShow : 6, 
    onRegisterApi : function(gridApi) { 
     $scope.gridEventsApi = gridApi; 
    } 

    // Column template definitions: 
    columnDefs: [ 
     { 
      name: 'Name', 
      displayName: 'Name', 
      cellTemplate : '<div ng-if="row.entity.deleted">{{row.entity.Name}}</div>' 
     } 
    ] 
}; 

Zrobiłem Plunk do zademonstrować realną technikę rozwiązania tego problemu: https://plnkr.co/edit/XQRC45vaiZCySZYkEGrz?p=preview

Answer 3

Wiem, że konkretnie powiedziałeś "bez faktycznej zmiany danych", ale przypisanie przefiltrowanego zbioru danych do siatki nie zmieniłoby zbioru danych, tylko danych dla siatki. Może to być również odpowiednie i prawidłowe rozwiązanie dla innych takich przypadków.

I rozwidlone CMR „s upadać to wykazać: http://plnkr.co/edit/NntwWb?p=preview

Kluczowym elementem jest po prostu dodanie filter podczas przypisywania zestawu danych:

$scope.gridOptions = { 
    data: $scope.myData.filter(function(row) { 
     return row.deleted !== "y"; 
    }) 
};