Question

我正在尝试在ion-segment内放置一个图表。第一次加载页面时，画布将显示在选定的段上。但是当我点击其他片段时，我收到了这个错误：

无法读取未定义
的属性“nativeElement”

我可以在画布中看到一个空白的html标签，并且不会复制实际的chartjs iframe。我尝试了很多选择，但找不到解决方案。有没有其他选择让这项工作？请帮忙

我的代码：

// On entering it works without issue as the element is now available
ionViewDidEnter(){
        let c = this.canvas.nativeElement;
        this.set1(c);            
    }
 //Switch case executes and error is thrown on any other segment is placed
 switch (level) {
            case "0":
                let c = this.canvas.nativeElement;
                this.set1(c); 
                break;
            case "1":
                let c1 = this.canvas1.nativeElement;
                this.set2(c1);
                break;
            case "2":
                let c2 = this.canvas2.nativeElement;
                this.set3(c2);
                break;
        }

我的HTML：

<div *ngSwitchCase="'easy'">
      <canvas #canvas></canvas>
</div>
<div *ngSwitchCase="'medium'">
     <canvas #canvas1></canvas>
</div>
<div *ngSwitchCase="'hard'">
     <canvas #canvas2></canvas>
</div>

Answer 1

我在ion-segment中遇到了与chart.js相同的问题，并使用[hidden]指令解决了这个问题，例如

 <canvas #canvas1 [hidden]="selectedValue!=1"></canvas>
 <canvas #canvas2 [hidden]="selectedValue!=2"></canvas>
 <canvas #canvas3 [hidden]="selectedValue!=3"></canvas>

Ionic2：在离子段内使用chartjs

1 个答案: