<p-chart *ngIf="renewData1" type="line" [data]="renewData1" [options]="lineOptions"></p-chart>
點擊
<button 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
})
}
uj5u.com熱心網友回復：
更新資料集值時不會觸發更改檢測，您可以試試這個，
Go() {
this.renewData1.datasets = []
for(loop){
this.renewData1.datasets.push({dynamic data});
}
this.renewData1 = {...this.renewData1}; // Do this in the end
}
uj5u.com熱心網友回復：
如前所述，由于您正在物件內部進行更新，因此不會觸發更改檢測，并且它僅跟蹤整個物件（物件參考）是否發生更改。
Go() {
this.renewData1 = {...this.renewData1, datasets: <*ASSING DYNAMIC DATA*> }
}
在這里，您可以直接在創建的新物件中創建和替換資料集。
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/402124.html