Primeng折线图不自动更新，仅在窗口刷新时更新答案

【问题标题】：Primeng line chart not updating automatically,only update on window refreshPrimeng折线图不自动更新，仅在窗口刷新时更新
【发布时间】：2022-01-01 17:13:01
【问题描述】：

 <p-chart *ngIf="renewData1" type="line"  [data]="renewData1" [options]="lineOptions"></p-chart>

点击

 <button class="goBtn btnText" style="width: 100%;" pButton type="button" label="GO"
                (click)="Go()" icon="filter-icon"></button>

这里的数据只有在调整窗口大小后才可见。

ts 文件

最初，此数据将加载到图表上

 this.renewData1 = {

        labels: ['2017', '2018', '2019', '2020'],
        datasets: [
            {

                label: 'Average',
                data: [81, 83, 82, 86],
                fill: false,
                borderColor: '#40B870',
                tension: .4,
                backgroundColor: '#40B870',
                datalabels: {
                    align: 'end',
                    anchor: 'end',
                }
            }
        ]
    }

新数据创建

单击按钮后，它将创建一个数据模式。所有代码都是工作文件，因为图表仅在调整窗口大小后才会重绘

    Go() {
        this.renewData1.datasets = []
              
               for(loop){
                   this.renewData1.datasets.push({
                               dynamic data
                    
                })
                       }

【问题讨论】：

标签： angular chart.js primeng

【解决方案1】：

更新数据集值时不会触发更改检测，你可以试试这个，

    Go() {
           this.renewData1.datasets = []
                  
           for(loop){
             this.renewData1.datasets.push({dynamic data});
           }
           this.renewData1 = {...this.renewData1}; // Do this in the end
}

【讨论】：

【解决方案2】：

如上所述，由于您在对象内部进行更新，因此不会触发更改检测，并且它仅跟踪整个对象（对象引用）是否发生更改。

Go() { 
this.renewData1 =  {...this.renewData1, datasets: <*ASSING DYNAMIC DATA*> }
}

在这里，您可以直接在新创建的对象中创建和替换数据集。

【讨论】：