Суммировать JSON в таблице

У меня есть небольшой JSON, например:

let testJson = [
  {"date":"2019.05.21","name":"Péter","num":"8"}, 
  {"date":"2019.05.22","name":"Norbert","num":"6"}, 
  {"date":"2019.05.21","name":"Sándor","num":"7"}, 
  {"date":"2019.05.24","name":"Béla","num":"4"},    
  {"date":"2019.05.23","name":"Sándor","num":"5"},  
  {"date":"2019.05.26","name":"Sándor","num":"6"},  
  {"date":"2019.05.27","name":"Péter","num":"7"},  
  {"date":"2019.05.28","name":"Péter","num":"8"}, 
  {"date":"2019.05.29","name":"Péter","num":"3"}, 
  {"date":"2019.05.30","name":"Péter","num":"6"}, 
  {"date":"2019.05.31","name":"Péter","num":"4"}
];

Я хотел бы агрегировать данные следующим образом:

введите здесь описание изображения


json datatable summary
person Langosfun    schedule 14.07.2019    source источник
comment
Я просто хочу отобразить таблицу на изображении в угловом приложении.   -  person Langosfun    schedule 14.07.2019
comment
Пример вы можете увидеть на картинке. Первый столбец показывает даты, а столбцы содержат числовые значения имен.   -  person Langosfun    schedule 14.07.2019

Ответы (2)


arrow_upward
2
arrow_downward

Попробуй это:

let testJson = [
  {"date":"2019.05.21","name":"Péter","num":"8"}, 
  {"date":"2019.05.22","name":"Norbert","num":"6"}, 
  {"date":"2019.05.21","name":"Sándor","num":"7"}, 
  {"date":"2019.05.24","name":"Béla","num":"4"},    
  {"date":"2019.05.23","name":"Sándor","num":"5"},  
  {"date":"2019.05.26","name":"Sándor","num":"6"},  
  {"date":"2019.05.27","name":"Péter","num":"7"},  
  {"date":"2019.05.28","name":"Péter","num":"8"}, 
  {"date":"2019.05.29","name":"Péter","num":"3"}, 
  {"date":"2019.05.30","name":"Péter","num":"6"}, 
  {"date":"2019.05.31","name":"Péter","num":"4"}
];
const groupBy = (arr) => arr.reduce((acc, ele)=>( (acc[ele.date] = acc[ele.date] || []).push(ele), acc),{})
const reformat = ([k, v])=> ({date:k,...Object.assign({},...v.map(l=>({[l.name]:l.num})))})
const result = Object.entries(groupBy(testJson))
.map(ele=>reformat(ele));

console.log(result);

person Ghoul Ahmed    schedule 14.07.2019
comment
Это хорошо работает, но как я могу отобразить значения в таблице? - person Langosfun; 14.07.2019
comment
@Langosfun, покажи это залоговое удержание, это очень полезно, объект-в-формате-csv-в-javascript - person Ghoul Ahmed; 14.07.2019
comment
Нет простого решения в angular (например *ngFor) для отображения этого? - person Langosfun; 14.07.2019
comment
@Langosfun, это решение с рабочей демонстрацией ngFor :) - person Ghoul Ahmed; 14.07.2019
comment
Огромное спасибо за вашу помощь. Можно ли динамически записывать имена? - person Langosfun; 14.07.2019
comment
@Langosfun, да, мы можем :) Рабочая демонстрация - person Ghoul Ahmed; 14.07.2019
comment
Привет! Извините :( У меня новая проблема... могу ли я легко создать эту таблицу из этого json: pasted.co/e1e77b95 - person Langosfun; 15.07.2019
comment
@Langosfun я добавил другое решение в пост ниже :) - person Ghoul Ahmed; 16.07.2019

arrow_upward
0
arrow_downward

Другое решение с этим форматом пример формата json:

let testJson = [
  {"date":"2019.05.21","name":"Péter","num":"8"}, 
  {"date":"2019.05.22","name":"Norbert","num":"6"}, 
  {"date":"2019.05.21","name":"Sándor","num":"7"}, 
  {"date":"2019.05.24","name":"Béla","num":"4"},    
  {"date":"2019.05.23","name":"Sándor","num":"5"},  
  {"date":"2019.05.26","name":"Sándor","num":"6"},  
  {"date":"2019.05.27","name":"Péter","num":"7"},  
  {"date":"2019.05.28","name":"Péter","num":"8"}, 
  {"date":"2019.05.29","name":"Péter","num":"3"}, 
  {"date":"2019.05.30","name":"Péter","num":"6"}, 
  {"date":"2019.05.31","name":"Péter","num":"4"}
];
const groupBy = (arr) => arr.reduce((acc, ele)=>( (acc[ele.date] = acc[ele.date] || []).push(ele), acc),{})
const reformat = ([k, v])=> ({[k]:v.map((res,i)=>({id:i, name:res.name, datum:res.date, number:res.num}))})
const result = Object.entries(groupBy(testJson))
.map(ele=>reformat(ele));

console.log(result);

person Ghoul Ahmed    schedule 15.07.2019
comment
Мне нужен не json, а таблица Angular :( - person Langosfun; 16.07.2019