Как напечатать этот конкретный JSON в таблице матов? - PullRequest
Новая
       7

Как напечатать этот конкретный JSON в таблице матов?

0 голосов
/ 06 мая 2019

У меня есть этот конкретный файл JSON, который мне не разрешено изменять, который выглядит следующим образом: 

{
"computers" : {
        "John" : {
            "version" : "1.42.0",
            "environment" : "Default",
            "platform" : "x64",
            "admin" : "true"
        },
        "Peter" : {
            "version" : "1.43.6",
            "environment" : "Default",
            "platform" : "x64",
            "admin" : "true"
        },
        "Eric" : {
            "version" : "1.43.6",
            "environment" : "Default",
            "platform" : "x64",
            "admin" : "false"
        }
}

Я использую метод JSON.parse() для анализа файла и помещаю его в MatTableDataSource.

Проблема в том, что когда мне нужно отобразить его в моем MatTable, я не могу получить к нему доступ так, как хочу.

У меня есть столбец, в котором я хочу отобразить все version параметры, поэтому для этого я не могу сказать: this.dataSource.computers.????.version

Ребята, вы видите, к чему я клоню?Ты хоть представляешь, что я могу сделать по-другому, чтобы решить эту проблему?

Будем рады читать тебя.

1 Ответ

1 голос
/ 06 мая 2019

Angular mat-table требует, чтобы входные данные были в массиве.Сначала мы используем Object.keys () , чтобы извлечь ключи, которые будут содержать список имен.Затем мы можем использовать Object.values ​​() для других значений в каждом ключе в формате массива.Затем следует сопоставление вышеуказанных объектов массива со свойством name из списка имен. 

const data = {
  "computers": {
    "John": {
      "version": "1.42.0",
      "environment": "Default",
      "platform": "x64",
      "admin": "true"
    },
    "Peter": {
      "version": "1.43.6",
      "environment": "Default",
      "platform": "x64",
      "admin": "true"
    },
    "Eric": {
      "version": "1.43.6",
      "environment": "Default",
      "platform": "x64",
      "admin": "false"
    }
  }
};

const nameList = Object.keys(data.computers);
const dataList = Object.values(data.computers).map((obj, index) => {
  obj['name'] = nameList[index];
  return obj;
});
console.log(dataList);
...