Question

我试图在UI-Grid中创建自定义下拉列表编辑器。我已经关注了Brian Hahn的博客文章。

除了我无法弄清楚gridOptions中定义的cellFilter的绑定之外，我已经完成了它的工作，我想在每一列中特别选择一个＆＃39;＆＃39; s colDef。

E.g。代码：

<ui-select-wrap>
    <ui-select ng-model="MODEL_COL_FIELD" ng-disabled="disabled" append-to-body="true" autofocus="true">
        <ui-select-match placeholder="Choose...">{{ MODEL_COL_FIELD | filter: col.cellFilter}}</ui-select-match>
        <ui-select-choices
                repeat="item[editDropdownIdLabel] as item in editDropdownOptionsArray | filter: $select.search">
            <span>{{ item[editDropdownValueLabel] }}</span>
        </ui-select-choices>
    </ui-select>
</ui-select-wrap>

由于某种原因，当我尝试从col.cellFilter调用它时，它没有调用过滤器。我希望MODEL_COL_FIELD有一些我可以参考的绑定，但我似乎无法找到它。

编辑：添加了我的网格选项。

vm.gridOptions = {
    showGridFooter: true,
    rowHeight: 40,
    enableCellEditOnFocus: true
};

vm.gridOptions.columnDefs = [
    {name: 'id', enableCellEdit: false},
    {name: 'name', displayName: 'Name (editable)'},
    {name: 'age', displayName: 'Age', type: 'number'},
    {
        name: 'list',
        displayName: 'List',
        editableCellTemplate: 'app/index/templates/uiSelect.tpl.html',
        cellFilter: 'listFilter',
        enableCellEditOnFocus: true
    },
    {
        name: 'checkbox',
        displayName: 'Checkbox',
        type: 'boolean',
        cellTemplate: '<input type="checkbox" ng-model="MODEL_COL_FIELD">'
    }
];

似乎在我的自定义下拉列表中应用了cellFilter。我已尝试使用CUSTOM_FILTERS，如模板中所示。

<ui-select-match placeholder="Choose...">{{ COL_FIELD CUSTOM_FILTERS }}</ui-select-match>

即使我在检查CUSTOM_FILTERS变量时在gridOption columnDefs中定义了cellFilters，它也会以未定义的形式返回。

Answer 1

您可以将cellFilter传递给gridOptions，而不是在下拉模板中引用单元格过滤器，而不是来自Brian Hann的页面上的例子

$scope.gridOptions = {
    rowHeight: 38,
    columnDefs: [
      { name: 'name' },
      { name: 'age', type: 'number' },
      {
        name: 'gender',
        editableCellTemplate: 'uiSelect.html',
        editDropdownOptionsArray: [
          'male',
          'female',
          'other'
        ],
        cellFilter : 'customFilterName'
      }
    ]
  };

UI-Grid v3.1.1 dropdownEditor过滤器绑定

1 个答案: