Select 过滤器不适用于 cellTemplate，angular ui-grid

Question

我正在使用 angular ui-grid 库并遇到了问题。我不明白如何为具有多个值的单元格应用过滤器。列类别有一个内部数组，我像这样通过 cellTemplate 显示

cellTemplate: "<div ng-repeat='item in row.entity[col.field]'>{{item.name}}</div>"

也在类别列中，我有 select 带动态数组的过滤器，这是我通过服务获得的

 filter: {
                type: uiGridConstants.filter.SELECT,
                selectOptions: $scope.categories
            },

$scope.categories 的来源

 lovServices.categories().then(function (result) {
                angular.forEach(result, function (value) {
                    $scope.categories.push({
                        value: value.id,
                        label: value.name
                    });
                });
            });

但是当我select使用任何类别过滤器时，它会显示一个空网格，我知道网格过滤器找不到任何值，但我不明白其中的原因。

谁能帮我找出我的错误？感谢您的帮助。

代码：

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

        $scope.categories = [];

        // Get Grid Data
        var getData = function () {
            lovServices.eventTypes()
                .then(function (response) {
                    //Initial Data
                    $scope.gridOptions.data = response;
                });
        };
        var getOptions = function () {
            lovServices.categories().then(function (result) {
                angular.forEach(result, function (value) {
                    $scope.categories.push({
                        value: value.id,
                        label: value.name
                    });
                });
            });
        };

        // Ui-Grid Options
        $scope.gridOptions = {
            enableFiltering: true,
            rowHeight: 60
        };

        // Ui-Grid Columns
        $scope.gridOptions.columnDefs = [
            {
                displayName: 'Name',
                field: 'name',
                sort: {
                    direction: uiGridConstants.ASC
                }
            },
            {
                field: 'description',
            },
            {
                field: 'category',
                enableSorting: false,
                filter: {
                    type: uiGridConstants.filter.SELECT,
                    selectOptions: $scope.categories
                },
                cellTemplate: "<div ng-repeat='item in row.entity[col.field]'>{{item.name}}</div>"
            }
        ];

        $scope.gridOptions.onRegisterApi = function (gridApi) {
            $scope.gridApi = gridApi;

        };

        //Get data
        getData();
        getOptions();

    });

This is a plunker 我的问题

Answer 1

因为你过滤的数据是一个数组，而不是一个平面值，所以必须通过迭代来比较它。

也就是说，必须提供匿名函数作为过滤器对象的 condition 键，以便遍历列值并找出与搜索词匹配的值。

Documentation

示例：

filter: {
    condition: function(searchTerm, cellValue, row, column) {
        var filtered = false;
        for (var i = 0; i < cellValue.length; i++) {
            filtered = cellValue[i].id === searchTerm;
            if (filtered) {
                break;
            }
        }
        return filtered;
    },
    type: uiGridConstants.filter.SELECT,
    selectOptions: $scope.categories
},

Updated plunkr

Select 过滤器不适用于 cellTemplate，angular ui-grid

Select filter doesn't work with cellTemplate, angular ui-grid

javascript

angularjs

angular-ui-grid