ag-Grid：valueFormatter 异常

Question

我正在根据通过网络服务接收的数据动态构建我的 ag-Grid 列（这是我构建列定义的代码片段；请参阅 plunker 了解整个示例）：

for (let i = 0; i < cr.attributes.length; i++) {

    let displayAlignment = '';
    switch (cr.attributes[i].dispAlign) {
        case 'C':
            displayAlignment = 'center';
            break;
        case 'L':
            displayAlignment = 'left';
            break;
        case 'R':
            displayAlignment = 'right';
            break;
        default:
            throw new Error('this will never happen, dispAlign for database must have value');
        }

    const displayMask = cr.attributes[i].dispMask;
    // console.log('displayMask: ', displayMask);
    const dataType = cr.attributes[i].dataType;
    // console.log('dataType: ', dataType);

    // console.log('cr attributes: ' , cr.attributes );
    childColDefsString = childColDefsString +
        '{"field": "' + cr.attributes[i].label + '"' +
        ', "cellStyle": {"textAlign": "' + displayAlignment + '"}' +
        ', "valueFormatter": "this.customValueFormatter(datatype, displayMask)"' +
        ', "width": 175, ' + '"hide": ' + cr.attributes[i].hide + '},';
}

在构建列时，我添加了一个 cellStyle，用于根据从 Web 服务（按预期工作）收到的列类型进行列对齐。我还尝试添加一个尝试调用自定义格式化程序的 valueFormatter。不幸的是，当 rowData 应用于（通过单击 "Apply Row Data" 按钮）到网格时，我遇到了以下 ag-Grid 抛出的异常（通过 Chrome -> Inspect -> Console 看到）：

Processing of the expression failed ag-grid.js:10595 
Expression = customValueFormatter(datatype, displayMask) ag-grid.js:10596 
Exception = ReferenceError: customValueFormatter is not defined

这是我创建的 Plunker 示例的 url：https://plnkr.co/edit/LcA5dRU9g8huLUWv3syZ?p=preview

我已经尝试了几次 ag-Grid 示例的迭代，https://www.ag-grid.com/javascript-grid-value-setters/，但无济于事。

Answer 1

不确定为什么要在 buildAvailableFields 中使用 string。

parentColDefsString = parentColDefsString +
                    '{"headerName": "' + cr.label + '", ' +
                    '"children": [';

Anyway, it's not an issue as you are facing.

正是在你的情况下，你在这里有一个错误：

"valueFormatter": "this.customValueFormatter(datatype, displayMask)"'

在这里您混合了输入属性而忘记输入 params 值。如果您想向 valueFormatter 函数添加额外的输入参数，您应该将其包装到 inner function

valueFormatter: (params) => this.customValueFormatter(params, datatype, displayMask);

-- 或纯 JS

valueFormatter: function(params) {
    this.customValueFormatter(params, datatype, displayMask);
}

But in case of 'string' concatenation, this function wouldn't be evaluated.

下一个问题是：

为什么不使用标准结构操作，这样会容易得多。

columnRequest.forEach(columnData=>{
    // your parent
    let column: ColDef={
        headerName: columnData.label,
        children:[]
    }
    // handle children
    column.attributes.forEach(childrenColumnData=>{
        let childrenColumn:ColDef={
            headerName: childrenColumnData.label,
            field: childrenColumnData.label
        }
        // condition for valueFormatter if it needed
        if(true){
            childrenColumn.valueFormatter = (params)=>this.customValueFormatter(params, yourAdditionalValue1, yourAdditionalValue2);
        }
    })
    this.colums.push(column);
}

ag-Grid：valueFormatter 异常

ag-Grid: valueFormatter exception

ag-grid

angular