Highcharts 如何更改图表'；隐藏/打开左侧导航菜单时，使用angular2高图表填充div的宽度？

使用angular2 highcharts隐藏/打开左侧导航菜单时，如何更改图表宽度以填充div？？？

我尝试使用style=“display:block；width:100%！important；”作为我找到的大多数资源的建议，但没有任何帮助

下面是使用mat sidenav容器内部图表和mat sidenav内容的示例：

Html

还添加了屏幕截图：关闭左侧导航菜单后，图表宽度保持不变。

---

这可以通过css来完成

chart {
    width: 100% !important;
    margin: 0 auto;
    display: block;
}

---

检查

解决方案之一是延迟图表的渲染。我使用了ngAfterViewInit（）生命周期挂钩：

    ngAfterViewInit() {
     setTimeout(() => {
      if(this.chart) {
        this.chart.reflow();
      }
     },100);
    }

chart {
    width: 100% !important;
    margin: 0 auto;
    display: block;
}

    ngAfterViewInit() {
     setTimeout(() => {
      if(this.chart) {
        this.chart.reflow();
      }
     },100);
    }