Угловой фильтр пользовательского интерфейса сетки с помощью кнопки

0

Использование Угловой пользовательской сетки http://ui-grid.info/docs/#/tutorial/321_singleFilter, я хочу иметь единственную кнопку для фильтрации только "Company = Mixers". Фильтр работает с использованием ввода, но как применить один фильтр к кнопке?

Plunker: http://plnkr.co/edit/R6PhMiBbaeqj9ErjdvY1?p=preview

HTML:

<div ng-controller="MainCtrl">

  <p><button ng-click='filterBtn()'>Filter for "Company = Mixers"</button></p>

  <p><input ng-model='filterValue'/><button ng-click='filter()'>Filter</button></p>

  <div id="grid1" ui-grid="gridOptions" class="grid"></div>

</div>

JS:

var app = angular.module('app', ['ngTouch', 'ui.grid']);

app.controller('MainCtrl', ['$scope', '$http', function ($scope, $http) {
  var today = new Date();
  $scope.gridOptions = {
    enableFiltering: false,
    onRegisterApi: function(gridApi){
      $scope.gridApi = gridApi;
      $scope.gridApi.grid.registerRowsProcessor( $scope.singleFilter, 200 );
    },
    columnDefs: [
      { field: 'name' },
      { field: 'company' }
    ]
  };

  $http.get('https://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/data/500_complex.json')
    .success(function(data) {
      $scope.gridOptions.data = data;
  });

 $scope.filterBtn = function(val) {
   // filter for "Company = Mixers" only.
   $scope.gridApi.grid.dataSource.filter({
      field: "company",
      operator: "eq",
      value: "Mixers" //or val
    });
 };

  $scope.filter = function() {
    $scope.gridApi.grid.refresh();
  };

  $scope.singleFilter = function( renderableRows ){
    var matcher = new RegExp($scope.filterValue);
    renderableRows.forEach( function( row ) {
      var match = false;
      [ 'name', 'company', 'email' ].forEach(function( field ){
        if ( row.entity[field].match(matcher) ){
          match = true;
        }
      });
      if ( !match ){
        row.visible = false;
      }
    });
    return renderableRows;
  };
}]);
Теги:
angular-ui-grid

1 ответ

0

Что вам нужно, добавьте фильтр программно в сетку:

$scope.filterBtn = function(val) {
     $scope.gridApi.grid.columns['Company'].filters[0] = {
                        term: 'mixers'
        };

  };

Вот некоторые связанные вопросы

  • 0
    ui-grid.info/docs/#/tutorial/321_singleFilter : Я использую сетку углового интерфейса вместо Kendo. Что такое «оператор»?
  • 0
    извините, я не заметил, что этот вопрос об угловой сетке) я не работал с этой сеткой, но Google говорит, что способ фильтрации
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню