Ionic2：在離子段內使用chartjs

Question

我想在ion-segment內放置一個圖表。第一次加載頁面時，畫布顯示在選定的段上。但後來當我在其他細分點擊我收到此錯誤：

​​

我能看到裏面的畫布空白HTML標記和實際chartjs IFRAME是不可複製的。我嘗試了很多選擇，但找不到解決方案。有沒有其他的選擇來完成這項工作？請幫助

我的TS碼：

// 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

我有chart.js之同樣的問題在ion-segment，並通過使用[hidden]指令解決它，例如

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