Question

点击任务后，我会看到任务列表

<a (click)="showMission(mission);"...

我叫这个功能

showMission(mission) {
      this.scrollUp();
      this.mission = mission;
      if (this.showHideMission === false) {
            this.showHideMission = true;
      }

      this.showHideCreateMission = false;
      this.showHideEditMission = false;
  }

将此div的状态更改为true

<div *ngIf="showHideMission" class="ng-hide m-portlet m-portlet--full-height ">

让我读取里面的数据。

我想显示该div内amchart的图表，然后插入

<div id="chartdiv" style="width: 100%; height: 400px; background-color: #FFFFFF;" ></div> 在<div *ngIf="showHideMission"..

内

我创建了创建图表的函数

createTimelineChart(mission){
let chart = am4core.create("chartdiv", am4charts.XYChart);
...

}

然后我将功能showMission更改为：

showMission(mission) {
      this.scrollUp();
      this.mission = mission;
      if (this.showHideMission === false) {
            this.showHideMission = true;
      }

      this.showHideCreateMission = false;
      this.showHideEditMission = false;
      this.createTimelineChart(mission); <---ADDED THIS LINE
  }

然后，当我执行任务时出现此错误：

html container not found
core.js:1673 ERROR Error: html container not found
    at createChild (Instance.js:129)
    at Module.create (Instance.js:172)
    at MissionComponent.push../src/app/mission/mission.component.ts.MissionComponent.createTimelineChart (mission.component.ts:203)
    at Object.eval [as updateDirectives] (MissionComponent.ngfactory.js:8278)
    at Object.updateDirectives (core.js:10798)
    at checkAndUpdateView (core.js:10451)
    at callViewAction (core.js:10692)
    at execEmbeddedViewsAction (core.js:10655)
    at checkAndUpdateView (core.js:10452)
    at callViewAction (core.js:10692)

但是，如果我打开第二个任务，它会显示图表而没有任何错误（因为已经显示了<div id="chartdiv"..），所以这里的真正问题是，它虽然无法找到div，但是将showHideMission设置为true

之后，我调用了创建图表的函数

Answer 1

我遇到了同样的问题，并使用了箭头功能。它为我解决了 componentDidUpdate =（）=> {}

角度当div可见时显示图表

1 个答案: