Angular 从数据库动态更新highcharts

我在angular 6应用程序中使用highcharts angular。 当我在Ngonit中设置数据时，图表是可见的，并且工作正常

但我想动态更新图表系列，这意味着向系列添加点，添加新系列。。。 这将在调用web API并获取新数据（调用loadBidChartData（））后完成

若我为聊天设置了新系列，或者更新了系列，图表并没有看到更改，初始状态并没有更改。 我如何解决这个问题？

下面是示例代码的一小部分 在html中是这样的：

<highcharts-chart [Highcharts]="Highcharts" [options]="chartOptions" style="width: 100%; height: 400px; display: block; overflow: auto;" [update]="true" ></highcharts-chart> 

解决方案： 使用演示在后台进行更新，并向highcharts添加和删除点：
感谢User3250和Wojciech Chmiel的帮助。

您需要使用

[（更新）]

标志更新系列，如下所示：

loadBidChartData(bidApiModel: BidItem[]): void {
    this.chartOptions.series= [{
        name: 'first last',
        data: [[Date.UTC(2018, 11, 16, 10, 56, 25), 23], [Date.UTC(2018, 11, 16, 10, 57, 15), 132], [Date.UTC(2018, 11, 16, 10, 58, 2), 312], [Date.UTC(2018, 11, 16, 10, 58, 15), 432]]
    },
    {
        name: 'second last',
        data: [[Date.UTC(2018, 11, 16, 10, 56, 28), 50], [Date.UTC(2018, 11, 16, 10, 56, 45), 152], [Date.UTC(2018, 11, 16, 10, 56, 53), 250], [Date.UTC(2018, 11, 16, 10, 57, 11), 320]]
    }];
   this.updateFlag = true;
}

<highcharts-chart [Highcharts]="Highcharts" [options]="chartOptions" style="width: 100%; height: 400px; display: block; overflow: auto;" [(update)]="updateFlag" ></highcharts-chart>

loadBidChartData（bidApiModel:BidItem[]）：无效{
此.chartOptions.series=[{
姓名：'最后一名'，
数据：[[Date.UTC（2018,11,16,10,56,25），23]，[Date.UTC（2018,11,16,10,57,15），132]，[Date.UTC（2018,11,16,10,58,2），312]，[Date.UTC（2018,11,16,10,58,15），432]]
},
{
姓名：'倒数第二'，
数据：[[Date.UTC（2018,11,16,10,56,28），50]，[Date.UTC（2018,11,16,10,56,45），152]，[Date.UTC（2018,11,16,10,56,53），250]，[Date.UTC（2018,11,16,10,57,11,320]]
}];
this.updateFlag=true；
}

---

此处正在运行的演示：

请检查此演示并更新：

loadBidChartData(bidApiModel: BidItem[]): void {
    this.chartOptions.series= [{
        name: 'first last',
        data: [[Date.UTC(2018, 11, 16, 10, 56, 25), 23], [Date.UTC(2018, 11, 16, 10, 57, 15), 132], [Date.UTC(2018, 11, 16, 10, 58, 2), 312], [Date.UTC(2018, 11, 16, 10, 58, 15), 432]]
    },
    {
        name: 'second last',
        data: [[Date.UTC(2018, 11, 16, 10, 56, 28), 50], [Date.UTC(2018, 11, 16, 10, 56, 45), 152], [Date.UTC(2018, 11, 16, 10, 56, 53), 250], [Date.UTC(2018, 11, 16, 10, 57, 11), 320]]
    }];
   this.updateFlag = true;
}

<highcharts-chart [Highcharts]="Highcharts" [options]="chartOptions" style="width: 100%; height: 400px; display: block; overflow: auto;" [(update)]="updateFlag" ></highcharts-chart>