0

当 Angular2 值发生变化时,我想更新我的谷歌图表。

在我的 Angular2 test.component.html 中,我有一个这样的模板:

<h1>
  Test Chart
</h1>

<div>
  // I want to bind this value with Goolgle Gauge
  {{parameter.value}}
</div>

<div class="gauge">
  <google-chart [data]="gaugeChartOptions"></google-chart>
</div>

我的 Angular2 test.component.ts 看起来像这样:

export class ChartTestComponent implements OnInit {

  public parameter: Parameter;

  public gaugeChartOptions = {
    chartType: 'Gauge',
    dataTable: [
      ['Label', 'Value'],
      ['Value', 5] // I'd like to bind it with {{parameter.value}}
    ],
    options: {
      width: 200, height: 250,
      redFrom: 90, redTo: 100,
      yellowFrom: 75, yellowTo: 90,
      minorTicks: 5
    },
  };

  constructor(private parameterService: ParameterService) {
  }

  changeVal(value: number) {
    this.gaugeChartOptions = Object.create(this.gaugeChartOptions);
    this.gaugeChartOptions.dataTable[1][1] =  Number(value);
  }

  ngOnInit() {

    this.parameter =  this.parameterService.getByPath('test_signal/10_Hz');
  }


}

如何使用 {{parameter.value}} 更改仪表值?

谢谢你。

4

0 回答 0