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 для выравнивания столбцов, основываясь на типе столбцов, полученных от веб-службы (которая работает должным образом).Я также пытаюсь добавить valueFormatter, который пытается вызвать пользовательский форматер.К сожалению, поскольку rowData применяется (нажав кнопку «Применить данные строки») к сетке, я сталкиваюсь со следующим сгенерированным исключением 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

Вот URL для примера Plunker, который я создал: https://plnkr.co/edit/LcA5dRU9g8huLUWv3syZ?p=preview

Я пробовал несколько итераций примера ag-Grid, https://www.ag -grid.com / javascript-grid-value-setters / , безрезультатно.

Answer 1

Не совсем уверен, почему вы работаете с string внутри buildAvailableFields.

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

В любом случае, это не проблема, с которой вы сталкиваетесь.

Именно в вашем случае у вас есть ошибка здесь:

"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);
}

Но в случаеиз конкатенации 'string' эта функция не будет оценена.

И следующий вопрос:

Почему бы просто не работать со стандартной структурой, это было бы намного проще.

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);
}