Angular JQXGrid cellrender устанавливает "значение" в виде строки, но выглядит неправильно, если я передаю объект

Angular JqxGrid имеет вызов функции cellrenderer для строк, которые я использую. У него есть аргументы: индекс, поле данных, значение, значение по умолчанию, столбец, данные строки.

Я хотел сделать немного магии в cellrender, но кажется, что когда столбец получает доступ к значению, являющемуся объектом, он переводит его в "[объект]", и это не идеально. Я также смотрел на это с точки зрения "rowdata", но это уже было преобразовано в строку.

Как мне получить доступ к реальному объекту, чтобы использовать его свойства для рендеринга? Я пытался получить доступ к базовому списку данных, но при щелчке и обновлении данных он будет выдавать ошибки из-за недоступности индекса, поэтому я немного разбираюсь в том, как распаковать эту информацию.

Я испытываю желание обработать необработанные данные в строку до того, как их использует сетка, но я не думаю, что это будет лучшим решением. Я бы подумал, что cellrenderer должен сделать это.

Мой коллега хотел, чтобы я присвоил все свойства объекта полю данных, но мне не нравится эта опция. Если рассматривать это как динамическое решение, поэтому я не уверен, что мне нравится добавлять значения в поле данных для каждого элемента, который я хочу использовать в значении строки

1 ответ

Я решил это довольно элегантно.

Все данные, которые будут частью dataAdapter, я проверяю на наличие сложных объектов и систематизирую их.

var data = []; //dataset
data.map( row => {
  let x = {};
  if (obj.hasOwnProperty(v) && obj[v] && obj[v].constructor === {}.constructor){
    x[v] = JSON.stringify(obj[v]);
  }else {
    x[v] = obj[v];
  }
  return x;
});

Теперь, когда данные заполнены, и столбцы установлены, мы переходим в cellrenderer:

col.cellsrenderer = (index: number, datafield: string, value: any, defaultvalue: any, column: any, rowdata: any): string => {
  let decode = value;
  try {
    decoded = JSON.parse(value);
  }catch (e){ 
    decoded = value;
  }

  //Now you can do custom stuff with a formatter:
  let formatter = getFormatter(XXXXX);
  let cell = `<div>${formatter.format(decoded)}</div>`; 
  //decoded would be an object OR a fundamental type string, number, etc.

  // When doing cellrenderer, you will only be able to use globalclasses, so custom component based class defintions will not work.  If needed, you would use inline styles, or expose global css/scss for a cell.
  return cell;
}
Другие вопросы по тегам