Как получить отфильтрованные данные из paged ui-grid

Question

Я хотел бы получить отфильтрованные данные из ui-сетки, когда функция пейджинга включена. В общем случае я использовал

$scope.gridApi.core.on.filterChanged($scope, function() { 

       if ($scope.gridApi.grid.columns[1].filter.term != "" && $scope.gridApi.grid.columns[1].filter.term != undefined) { 
        var dd =$scope.gridApi.core.getVisibleRows($scope.gridApi.grid); 
        console.log(dd); 
      }); 

но код не работает хорошо, когда подкачки включен, он возвращал только строки первой страницы. но мне нужны все отфильтрованные данные.

самым простым решением является источник данных фильтра, основанный на члене фильтра, но он резко снижает производительность.

любой совет?

Answer 1

Примечание: Я не пробовал это с разбивкой на страницы, просто группируя, но надеюсь, что это даст вам подсказку.


Пробуйте использовать событие rowsVisibleChanged вместе с событием filterChanged. Вы должны использовать оба варианта, потому что, если вы используете событие filterChanged, оно не будет работать, поскольку оно запускается до того, как строки будут фактически отфильтрованы. Я использую переменную флага (filterChanged), чтобы узнать, был ли фильтр изменен.

Затем используйте что-то вроде lodash для фильтрации $scope.gridApi.grid.rows, что иметь visible набор свойств для true:

// UI-Grid v.3.0.7 
var filterChanged = false; 

$scope.gridApi.core.on.filterChanged($scope, function() { 
    filterChanged = true; 
}); 

$scope.gridApi.core.on.rowsVisibleChanged($scope, function() { 
    if(!filterChanged){ 
     return; 
    } 
    filterChanged = false; 
    // The following line extracts the filtered rows 
    var filtered = _.filter($scope.gridApi.grid.rows, function(o) { return o.visible; }); 
    var entities = _.map(filtered, 'entity'); // Entities extracted from the GridRow array 
}); 

Answer 2

Я был в состоянии экспортировать отфильтрованные данные по всей пагинацией через uiGridExporterService службы. Благодаря приведенному выше ответу Патрисио за подсказку.

//you can set it to ALL or VISIBLE or SELECTED 
var columnsDownloadType = uiGridExporterConstants.ALL; 

//get all the visible rows across all paginations 
var filtered = _.filter(grid.api.grid.rows, function (o) { 
    return o.visible; 
}); 

//get the entities of each of the filtered rows 
var entities = _.map(filtered, 'entity'); 

//get all or visible column headers of this grid depending on the columnsDownloadType 
var exportColumnHeaders = grid.options.showHeader ? uiGridExporterService.getColumnHeaders(grid, columnsDownloadType) : []; 

var exportData = []; 
/**this lodash for-each loop will covert the grid data into below array of array format 
* [[{value:'row1col1value'},{value:'row1col2value'}],[{value:'row2col1value'},{value:'row2col2value'}].....] 
* uiGridExporterService.formatAsCsv expects it in this format 
**/ 
_.each(entities, function (row) { 
    var values = []; 
    _.each(exportColumnHeaders, function (column) { 
     var value = row[column.name]; 
     values.push({value: value}); 
    }); 
    exportData.push(values); 
}); 

//format the header,content in csv format 
var csvContent = uiGridExporterService.formatAsCsv(exportColumnHeaders, exportData, ','); 

//export as csv file 
uiGridExporterService.downloadFile(grid.options.exporterCsvFilename, csvContent, grid.options.exporterOlderExcelCompatibility); 

Answer 3

Я пробовал пользовательский экспортер, и это сработало!

• Предпосылки:

  enableSelectAll:true, 
  multiSelect:true, 
  

• контроллер необходим:

  uiGridExporterService,uiGridExporterConstants 
  

• модуль приложения требуется:

  "ui.grid.selection" ,"ui.grid.exporter" 
  
  $scope.exportCSV = function(){ 
          var exportService=uiGridExporterService; 
          var grid=$scope.gridApi.grid; 
          var fileName="myfile.csv"; 
  
          exportService.loadAllDataIfNeeded(grid, uiGridExporterConstants.ALL, uiGridExporterConstants.VISIBLE).then(function() { 
           var exportColumnHeaders = exportService.getColumnHeaders(grid, uiGridExporterConstants.VISIBLE); 
  
           $scope.gridApi.selection.selectAllVisibleRows(); 
  
           var exportData = exportService.getData(grid, uiGridExporterConstants.SELECTED,uiGridExporterConstants.VISIBLE); 
           var csvContent = exportService.formatAsCsv(exportColumnHeaders, exportData, grid.options.exporterCsvColumnSeparator); 
           exportService.downloadFile(fileName, csvContent, grid.options.exporterOlderExcelCompatibility); 
           $scope.gridApi.selection.clearSelectedRows(); 
          }); 
          }