Angular 中使用 ng2 图表和 ng5-slider 的条形图数据集设置不正确
The dataset for bar graph is not set properly using ng2 charts and ng5-slider in Angular
我有一个范围滑块和条形图。我正在尝试使用范围滑块更改条形图的颜色，我能够使用滑块成功更改条形图的颜色，但条形图的数据未正确显示。 https://stackblitz.com/edit/angular-ivy-wjpkcr
所以我发现了问题，但您需要对其进行一些处理才能使其发挥全部功能。
看起来当您设置 [datasets]="getBarChartData()" 时，图表试图呈现但卡在循环中，因为背景颜色的值在 getBarChartData() 内无限变化，请注意您有两种方式绑定滑块：
<ng5-slider [(value)]='value' [(highValue)]='highValue' [options]='options'>
你不能依赖它来正确更新你的图表。
我所做的是，我向滑块添加了一个 valueChange 事件，并在滑块中的值发生变化时更新图表。
<ng5-slider (valueChange)="logValue($event)" [(value)]='value' [(highValue)]='highValue' [options]='options'>
我还添加了 ngOnInit() 以正确初始化 dataValues
link 演示：link
我有一个范围滑块和条形图。我正在尝试使用范围滑块更改条形图的颜色，我能够使用滑块成功更改条形图的颜色，但条形图的数据未正确显示。 https://stackblitz.com/edit/angular-ivy-wjpkcr
所以我发现了问题，但您需要对其进行一些处理才能使其发挥全部功能。
看起来当您设置 [datasets]="getBarChartData()" 时，图表试图呈现但卡在循环中，因为背景颜色的值在 getBarChartData() 内无限变化，请注意您有两种方式绑定滑块：
<ng5-slider [(value)]='value' [(highValue)]='highValue' [options]='options'>
你不能依赖它来正确更新你的图表。
我所做的是，我向滑块添加了一个 valueChange 事件，并在滑块中的值发生变化时更新图表。
<ng5-slider (valueChange)="logValue($event)" [(value)]='value' [(highValue)]='highValue' [options]='options'>
我还添加了 ngOnInit() 以正确初始化 dataValues
link 演示：link