Angular UI-网格过滤器代码不起作用

Question

下面的代码与教程中的代码类似http://ui-grid.info/docs/#/tutorial/321_singleFilter但它不显示数据网格，我不确定为什么

我检查了 plunk，没有发现任何错误，下面是我的代码

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

app.controller('MainCtrl', function($scope) {

    $scope.gridOptions = {
        enableFiltering: false,
        onRegisterApi: function(gridApi) {
            $scope.gridApi = gridApi;
            $scope.gridApi.grid.registerRowsProcessor($scope.singleFilter, 200);
        },
        columnDefs: [
            {
                field: 'name'
            }, {
                field: 'last'
            }, {
                field: 'address'
            }, {
                field: 'name1'
            }, {
                field: 'last1'
            }, {
                field: 'address1'
            }, {
                field: 'last45'
            }
        ],
        data: [
            {
                "name": "test",
                "last": "test2",
                "address": "test3",
                "name1": "test",
                "last1": "test2",
                "address1": "test3",
                "last45": "op"
            }, {
                "name": "test",
                "last11": "test2",
                "address": "test2"
            }, {
                "name": "test",
                "last": "test2",
                "address": "test3"
            }, {
                "name": "test",
                "last": "test2",
                "address": "test3"
            }, {
                "name": "test",
                "last": "test2",
                "address": "test3"
            }, {
                "name": "test",
                "last": "test2",
                "address": "test3"
            }, {
                "name": "test",
                "last": "test2",
                "address": "test3"
            }
        ]
    };


    $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', 'last', 'address'].forEach(function(field) {
                if (row.entity[field].match(matcher)) {
                    match = true;
                }
            });

            if (!match) {
                row.visible = false;
            }
        });
        return renderableRows;
    };
})

Answer 1

你的问题好像是数据的问题。由于您的数据没有每一行的所有列。您将必须修复您的 singleFilter 方法来检查这种情况。

$scope.singleFilter = function(renderableRows) {
var matcher = new RegExp($scope.filterValue);
renderableRows.forEach(function(row) {
  var match = false;
  ['name', 'last', 'address'].forEach(function(field) {

    if (row.entity[field] && row.entity[field].match(matcher)) {
      match = true;
    }
  });
  if (!match) {
    row.visible = false;
  }
});
return renderableRows;
};

检查此 plnk 的工作版本 http://plnkr.co/edit/l7Uc3H0CnoyRkaHdNZ9P?p=preview

Angular UI-网格过滤器代码不起作用

Angular UI-grid filter code not working

javascript

angularjs

angular-ui-grid