Вам не нужно создавать для него новые cellRenderer
и cellEditor
, ag-grid предоставляет для него встроенный select
. **
При использовании objects
(для раскрывающегося списка \ combobox) внутри single cell
- вам необходимо реализовать обработчики значений : valueParser
и valueFormatter
:
парсер значений : после редактирования ячеек в сетке у вас есть возможность проанализировать значение, прежде чем вставлять его в ваши данные. Это делается с помощью анализаторов значений.
colDef.valueParser = (params) => {
return this.lookupKey(mapping, params.newValue);
}
Форматирование значений : средства форматирования значений позволяют форматировать значения для отображения. Это полезно, когда данные одного типа (например, numeri c), но должны быть преобразованы для чтения человеком (например, ввод символов валюты и форматирования чисел).
colDef.valueFormatter = (params) => {
return this.lookupValue(mapping, params.newValue);
}
* где mapping
представляет ваш объект, и внутри каждой из этих функций вы просто извлекаете ключ или значение.
Исходное решение:
lookupValue(mappings, key) {
return mappings[key];
}
lookupKey(mappings, name) {
var keys = Object.keys(mappings);
for (var i = 0; i < keys.length; i++) {
var key = keys[i];
if (mappings[key] === name) {
return key;
}
}
}
и здесь мои небольшие изменения:
lookupValue(mappings, key:string) {
if(!mappings || !mappings.find(item => item.Id == key)) return null;
else
return mappings.find(item => item.Id == key).Value;
}
lookupKey(mappings, name) {
let key: any;
for (key in mappings) {
if (mappings.hasOwnProperty(key)) {
if (name === mappings[key]) {
return key.Id;
}
}
}
}
ОБНОВЛЕНИЕ
Чтобы заполнить раскрывающийся список, вам нужно использовать cellEditorParams
:
colDef.cellEditor = 'selectCellEditor';
colDef.cellEditorParams = {
values: yourList,
},
** Но в случае, когда это может потребоваться, вам все равно нужно иметь оба рендерера и хранить object
внутри, и тогда вы сможете выбрать, что будет отображаться на каждом этапе.