You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在ag-Grid中使用agSelectCellEditor实现键值对功能?

AngularJS + ag-grid-community JS版下拉框默认选中问题解决

使用AngularJS搭配ag-grid-community的JS版本时,遇到编辑字段的下拉框(DDL)无法默认选中当前项的问题。为实现键值对选择功能,我修改了ag-grid-community.js文件,通过skipCheckType参数跳过dataTypeMatcher的类型校验,避免抛出错误。

列配置说明

cellEditorParams.values是一组{ key: ..., name: ... }格式的键值对数组,对应的列配置代码如下:

{
    headerName: 'Frequency', field: "Frequency",
    cellEditor: 'agSelectCellEditor',
    singleClickEdit: true,
    cellEditorParams: {
        values: $scope.gridFrequencies,
    },
    valueFormatter: (params) => {
        console.log('valueFormatter', params);
        return params.value?.name ? params.value.name:  $scope.gridFrequencies.find(o => o.key == params.value)?.name;
    },
    valueSetter: params => {
        if (params.newValue) {
            params.data.Frequency = params.newValue.key;
            return true; // 表示值已成功设置
        }
        return false; // 表示值未设置
    },
    skipCheckType: true,
    tooltipValueGetter: params => {
        return params.data.Frequency;
    }
}

核心修改逻辑

通过在列配置中添加skipCheckType: true,并修改ag-grid-community.js内部的类型校验逻辑,让其识别该参数并跳过类型检查,从而解决键值对数据与单元格存储值类型不匹配导致的默认选中失败问题。

内容的提问来源于stack exchange,提问作者Jeff

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.13 21:22:44