Angular2 の値が変更されたときに Google チャートを更新したいと考えています。
私の 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}} でゲージ値を変更するにはどうすればよいですか?
ありがとうございました。