Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/ssis/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Angular ngx图表结果/数据阵列更新问题(角度)_Angular_Ngx Charts - Fatal编程技术网

Angular ngx图表结果/数据阵列更新问题(角度)

Angular ngx图表结果/数据阵列更新问题(角度),angular,ngx-charts,Angular,Ngx Charts,在我的angular 8项目中,我使用ngx图表水平条。 当我在ngOninit函数中加载结果/数据数组时,它工作正常 但我想在点击按钮时更改现有数据。它将新数据加载到图形中 <ngx-charts-bar-horizontal [view]="view" [scheme]="colorScheme" [results]="single" [gradient]="gradient" [xA

在我的angular 8项目中,我使用ngx图表水平条。 当我在ngOninit函数中加载结果/数据数组时,它工作正常

但我想在点击按钮时更改现有数据。它将新数据加载到图形中

<ngx-charts-bar-horizontal

  [view]="view"
  [scheme]="colorScheme"
  [results]="single"
  [gradient]="gradient"
  [xAxis]="showXAxis"
  [yAxis]="showYAxis"
  [legend]="showLegend"
  [showXAxisLabel]="showXAxisLabel"
  [showYAxisLabel]="showYAxisLabel"
  [xAxisLabel]="xAxisLabel"
  [yAxisLabel]="yAxisLabel"
  (select)="onSelect($event)"
  (activate)="onActivate($event)"
  (deactivate)="onDeactivate($event)"
  [legendPosition]="'below'">
</ngx-charts-bar-horizontal>
单击一个按钮,我将调用一个api以获取新数据并推送到结果数组



this.dashboardservice.getCapabilitiesData(data).subscribe(response => {
          this.single=[];
          this.capabilitiesData = response;

          if (this.capabilitiesData.muelCapabilityGraph) {

            Object.keys(this.capabilitiesData.muelCapabilityGraph).forEach(key => {
              var obj = {
                "name": key,
                "value": this.capabilitiesData.muelCapabilityGraph[key]
              }
              this.single.push(obj);
            });

          }
          this.single=[...this.single];
          console.log("single-->"+JSON.stringify(this.single))
        });

this.single Has the new data but chart is blank.


我不确定为什么图表没有用新数据更新。请帮忙

我从中派生了一个项目,并添加了一个功能,以便在单击按钮(“添加数据”)时添加列/栏。请看一看。stackblitz上的代码:

我终于找到了答案。this.single=[…this.single];。我们需要在对结果数据进行任何更新后进行自我分配。这将触发图表的更新。


this.dashboardservice.getCapabilitiesData(data).subscribe(response => {
          this.single=[];
          this.capabilitiesData = response;

          if (this.capabilitiesData.muelCapabilityGraph) {

            Object.keys(this.capabilitiesData.muelCapabilityGraph).forEach(key => {
              var obj = {
                "name": key,
                "value": this.capabilitiesData.muelCapabilityGraph[key]
              }
              this.single.push(obj);
            });

          }
          this.single=[...this.single];
          console.log("single-->"+JSON.stringify(this.single))
        });

this.single Has the new data but chart is blank.