类型错误:数据不可迭代,在嵌套数组上使用 ngfor

问题描述

  rowData=  [{
  "label": "president","contestants": [{
    "name": "john key","Votes": 2
  },{
    "name": "john hi","Votes": 1
  },{
    "name": "john kl","Votes": 1
  }]
},{
  "label": "organizer","contestants": [{
    "name": "michael skie","Votes": 3
  },{
    "name": "michael e",{
  "label": "secretary","contestants": [{
    "name": "sampson eons",{
    "name": "sampson mji","Votes": 2
  }]
}]
我有一个看起来像这样的 rowData,我想使用 NGFOR

动态创建多个带有结果的条形图

<div *ngIf="rowData.length >0">
  <div *ngFor="let arr of rowData  let i=index">
    <div *ngFor="let elm of arr.contestants">
   <ngx-charts-bar-vertical
    [view]="view"
    [scheme]="colorScheme"
    [results]="elm"
    [gradient]="gradient"
    [xAxis]="showXAxis"
    [yAxis]="showYAxis"
    [legend]="showLegend"
    [showXAxisLabel]="showXAxisLabel"
    [showYAxisLabel]="showYAxisLabel"
    [xAxisLabel]="xAxisLabel"
    [yAxisLabel]="yAxisLabel"
    (select)="onSelect($event)">
  </ngx-charts-bar-vertical> 
  </div>
     </div>
</div>

我收到数据不可迭代的错误。有人可以帮我吗

解决方法

我通过重新排列json解决了

rowData = [
  [{
    "label": "president","contestants": [{
      "name": "john key","votes": 2
    },{
      "name": "john hi","votes": 1
    },{
      "name": "john kl","votes": 1
    }]
  },{
    "label": "organizer","contestants": [{
      "name": "michael skie","votes": 3
    },{
      "name": "michael e",{
    "label": "secretary","contestants": [{
      "name": "sampson eons",{
      "name": "sampson mji","votes": 2
    }]
  }]
]

<div *ngIf="rowData.length >0">
  <div *ngFor="let arr of rowData  let i=index">
    <div *ngFor="let elm of arr.contestants">
   <ngx-charts-bar-vertical
    [view]="view"
    [scheme]="colorScheme"
    [results]="elm"
    [gradient]="gradient"
    [xAxis]="showXAxis"
    [yAxis]="showYAxis"
    [legend]="showLegend"
    [showXAxisLabel]="showXAxisLabel"
    [showYAxisLabel]="showYAxisLabel"
    [xAxisLabel]="xAxisLabel"
    [yAxisLabel]="yAxisLabel"
    (select)="onSelect($event)">
  </ngx-charts-bar-vertical> 
  </div>
     </div>
</div>

我移动了结果 rowData[0];它解决了我的问题