Angular 8中ag-grid空单元格点击agDatePickerComponent报错求助

1. 修正列定义中的valueGetter逻辑 #

你的valueGetter条件判断存在语法问题，导致空值没有被正确转换为空字符串，修改后确保所有空/无效值都返回空字符串：

{
    headerName: "Received Date",
    field: "received_date",
    autoHeight: true,
    filterParams: { comparator: agDateComparator },
    cellEditorFramework: agDatePickerComponent,
    cellEditorParams: {
        inlineFlag: false,
    },
    editable: this.checkReceivedDate.bind(this),
    valueGetter: params => {
        const dateVal = params.data.received_date;
        // 覆盖"None"、undefined、null三种空值场景
        return dateVal === "None" || dateVal == null ? "" : dateVal;
    }
},

2. 修复agDatePickerComponent的agInit方法 #

报错根源是组件在初始化时直接对空值调用了split方法，需要在处理值之前先做非空判断：

agInit(params: any): void {
    // 先检查值是否存在，再执行split操作
    if (params.value) {
        const dateParts = params.value.split('-');
        // 原有的日期解析逻辑，比如转成Date对象
        this.selectedDate = new Date(+dateParts[0], +dateParts[1] - 1, +dateParts[2]);
    } else {
        // 空值时初始化默认状态，比如设置为null或当前日期
        this.selectedDate = null;
    }
}

原理说明 #

• 修正valueGetter后，所有空值场景都会返回空字符串，确保传给单元格编辑器的是有效值（空字符串而非null/undefined）
• 在组件的agInit方法中增加非空判断，避免对空值执行split操作，同时为空值设置合理的初始状态，确保日期选择器能正常弹出

内容的提问来源于stack exchange，提问作者Nitin Niraj