图形显示正确,我只想根据下拉选项更改数据,这是我到目前为止尝试的代码:
TS
this.graphicService.getDatas().subscribe(datas => {
this.datas = datas;
console.log(datas);
if (this.datas[0].dimension == "level1")
{
this.counter = 1;
}
else if(this.datas[0].dimension == 'level2'){
this.counter = 2;
}
else{
this.counter = 3;
}
this.barChartData = {
labels: ["Level1", "Level2", "Level3", "Level4", "Level5"],
datasets: [{
label: 'Subdim',
data: [
this.datas[this.counter].subdimensions[0].level1,
this.datas[this.counter].subdimensions[0].level2,
this.datas[this.counter].subdimensions[0].level3,
this.datas[this.counter].subdimensions[0].level4,
this.datas[this.counter].subdimensions[0].level5
]
}
};
这里的逻辑是当选择下拉列表时,计数器值将改变,数组值将显示我从API获得的数据。
HTML
<select [(ngModel)]="datas[0].dimension" class="form-control">
<option *ngFor="let data of datas" [value]="data.dimension">{{ data.dimension }}</option>
</select>