angular-highcharts 执行destroy()的问题

当前情况是这样,同一个component中的一个dialog里面会展示一个chart,dialog hide之后希望destroy了

 destoryHistoricalChart() {
    this.historicalChart.destroy();
  }

<p-dialog header="Historical Insight" (onHide)="destoryHistoricalChart()" [blockScroll]="true"
        [(visible)]="dialog2Display" [style]="{width: '80%'}" [modal]="true" [responsive]="true" [maximizable]="true"
        [baseZIndex]="10005">
        ...................
        </p-dialog>

但是出现了问题,第一次打开dialog没有任何问题,当destroy之后,再打开dialog就无法显示chart.
所以代码改成这样就解决了

  destoryHistoricalChart() {
    this.historicalChart.destroy();
    this.historicalChart = undefined;
  }