Question

我有一个包含多个列和标题的网格。还有一个文本框可以搜索该列中的数据，我正在使用的代码是

$scope.gridOptions = {
    data: 'myData',
 selectedItems: $scope.selections,
    enablePaging: true,
     showGroupPanel: true,
        jqueryUIDraggable: true,
        plugins: [filterBarPlugin],
        headerRowHeight: 60 ,// give room for filter bar
    totalServerItems: 'totalServerItems',
    pagingOptions: $scope.pagingOptions,
    enableHighlighting: false,
    selectWithCheckboxOnly: false,
    showFooter: true,
    showSelectionCheckbox: false,


  };
   $scope.selections = [];
   var filterBarPlugin = {
        init: function(scope, grid) {
            filterBarPlugin.scope = scope;
            filterBarPlugin.grid = grid;
            $scope.$watch(function() {
                var searchQuery = "";
                angular.forEach(filterBarPlugin.scope.columns, function(col) {
                    if (col.visible && col.filterText) {
                        var filterText = col.filterText +'; ';
                        searchQuery += col.displayName + ": " + filterText;
                    }
                });
                return searchQuery;
            }, function(searchQuery) {
                filterBarPlugin.scope.$parent.filterText = searchQuery;
                filterBarPlugin.grid.searchProvider.evalFilter();
            });
        },
        scope: undefined,
        grid: undefined,
    };

    $scope.myHeaderCellTemplate = '<div class="ngHeaderSortColumn {{col.headerClass}}" ng-style="{cursor: col.cursor}" ng-class="{ ngSorted: !noSortVisible }">'+
                           '<div ng-click="col.sort($event)" ng-class="\'colt\' + col.index" class="ngHeaderText">{{col.displayName}}</div>'+
                           '<div class="ngSortButtonDown" ng-show="col.showSortButtonDown()"></div>'+
                           '<div class="ngSortButtonUp" ng-show="col.showSortButtonUp()"></div>'+
                           '<div class="ngSortPriority">{{col.sortPriority}}</div>'+
                         '</div>'+
                         '<input type="text" ng-click="stopClickProp($event)" placeholder="Filter..." ng-model="col.filterText" ng-style="{ \'width\' : col.width - 14 + \'px\' }" style="position: absolute; top: 30px; bottom: 30px; left: 0; bottom:0;"/>' +
                         '<div ng-show="col.resizable" class="ngHeaderGrip" ng-click="col.gripClick($event)" ng-mousedown="col.gripOnMouseDown($event)"></div>';
 $scope.gridOptions.columnDefs = 'gridColumnDefs';


  $scope.gridColumnDefs = [

     {field: 'Actions', cellTemplate: 'Template.html'},
    {
    field: 'index',
    displayName: 'Index',
    headerCellTemplate: $scope.myHeaderCellTemplate
},
    {
      field: "S",
      displayName:"Severity",

    cellTemplate: '<div class="ngCellText" ng-class="col.colIndex()"><span ng-cell-text><img src="http://goo.gl/vxCnLC"></img></span></div>'



    },

      {field:'SA', displayName:'ServiceAffecting', 
//cellTemplate:'<div><img ng-src="{{row.getProperty(\'"SA"\') | imagefilter}}"></img></div>'
cellTemplate:'<div><img ng-src="{{row.getProperty(\'SA\') | imagefilter}}"></img></div>'

    }, {
      field: "TR",
      displayName:"Trigger Redundancy",
      cellTemplate: '<div class="ngCellText" ng-class="col.colIndex()"><span ng-cell-text><img src="http://goo.gl/aFomAA"></img></span></div>'
      ,headerCellTemplate: $scope.myHeaderCellTemplate

    }, {
      field: "D",
      displayName:"Description",
      headerCellTemplate: $scope.myHeaderCellTemplate
    },
    {
      field: "O",
      displayName:"Object",
      headerCellTemplate: $scope.myHeaderCellTemplate
    },
    {
      field: "Dev",
      displayName:"Device",
      headerCellTemplate: $scope.myHeaderCellTemplate
    },
    {
      field: "IP",
      displayName:"IP Address",
      headerCellTemplate: $scope.myHeaderCellTemplate
    },
    {
      field: "Group",
      displayName:"Group",
      headerCellTemplate: $scope.myHeaderCellTemplate
    },
    {
      field: "AT",
      displayName:"Assert Time"
    },
    {
      field: "AckT",
      displayName:"Acknowlegded Time"
    }
  ];

我的过滤效果不正常，请说明可能的原因或建议进行适当的更改。此外，它在第一次被禁用，当我第一次使用它时，我无法在搜索文本框中获得光标。我也希望这也适用于数值。链接：

http://plnkr.co/edit/5Z8QXhGjsB5rpCVDlfqs?p=preview

Answer 1

默认过滤器不是＆＃34;包含＆＃34;，可能是＆＃34; Startswith＆＃34;，

所以，注入uiGridConstants

并添加

filter:{condition:uiGridConstants.filter.CONTAINS}

到你的columnDefs

使用角度Js在ng-grid中无法正确过滤数据

1 个答案: