Angular ngx-chart：对象不可迭代

Question

我对 Anguler ngx-charts 有疑问。我正在尝试绘制数据，但仍然出现错误：
ERROR TypeError: data is not iterable.

如果我使用 ts 文件中定义的数据，绘图会正确显示。

public data = [
  {
    "name": "Požadovaný prùtok vzduchu",
    "series": [
      {
        "value": "  923",
        "name": "0"
      },
      {
        "value": "  923",
        "name": "0"
      },
      {
        "value": "  924",
        "name": "1"
      },
      {
        "value": "  916",
        "name": "5"
      },
      {
        "value": "  916",
        "name": "8"
      }
    ]
  }
];

但我需要绘制来自 https 请求的数据。我的代码是：

this.loadedFile.getContent(email,this.nazev).subscribe(res => { 
        console.log(this.data);
        this.data = res.data;
  });

getContent(folder:any, filename:any) {
    return this.httpClient.post<any>(apiUrl + 'loginApi/contentApi/file.php', {folder,filename});  
    }

结果 res.data 应该是 JSON 并且格式正确。

"data": {
        "name": "Požadovaný prùtok vzduchu",
        "series": [
            {
                "value": "  923",
                "name": "0"
            },
            {
                "value": "  923",
                "name": "0"
            },
etc...

这是我的代码，由于可迭代错误，我无法根据请求绘制数据。我尝试将其转换为字符串并返回 JSON 格式，用作字符串，创建数组但没有任何效果。

谢谢！ :)

Answer 1

使用JSON.stringify()和replace()将{替换为[{，将}替换为}]和JSON.parse()再次成为对象。

let data = {
  "name": "Požadovaný prùtok vzduchu",
  "series": [{  "value": "  923",  "name": "0"},{  "value": "  923",  "name": "0"},{  "value": "  924",  "name": "1"},{  "value": "  916",  "name": "5"},{  "value": "  916",  "name": "8"}
  ]
};
console.log(JSON.parse(JSON.stringify(data).replace(/^\{(.*)\}$/,"[ {  }]")));

.as-console-wrapper { max-height: 100% !important; top: 0; }

Angular ngx-chart：对象不可迭代

Angular ngx-chart: Object not iterable

angular

ngx-charts