html文件
<div style="width: 100%; display: block">
<canvas
*ngIf="loaded"
baseChart
[data]="barChartData"
[labels]="barChartLabels"
[options]="barChartOptions"
[legend]="barChartLegend"
[chartType]="barChartType"
>
</canvas>
</div>
Run Code Online (Sandbox Code Playgroud)
ts 文件
barChartOptions: any = {
scaleShowVerticalLines: false,
responsive: true
};
barChartLabels: string[] =[];
barChartType: string = 'horizontalBar';
barChartLegend: boolean = true;
barChartData: any[] =[];
loaded = false;
this.service.Salescount(form).subscribe((data) => {
this.name = data.result;
this.barChartLabels = this.name.map((item) => item.name);
this.barChartData = this.name.map((item) => item.sales);
this.loaded = true;
})
Run Code Online (Sandbox Code Playgroud)
barchart.labels 和 barchartdata 中有 4 个值。运行时,我收到错误“类型‘string’不能分配给类型‘ChartType’”
我还在 app.module.ts 中导入了 ChartModules