chart.js圖表​​不會顯示或隱藏Angular指令ng-show和ng-hide

Question

我有一個圖表，它以靜態方式顯示時正常工作。

var ctx = document.getElementById("myChart").getContext("2d"); 
$scope.lineChart = new Chart(ctx).Line(data, chartConfig); 

但是，當我將它包裝在ng-show中時，如下所示，它會停止渲染本身。

<div ng-show="output.showChart"> 
    <canvas id="myChart"></canvas> 
</div> 

某處在JS：

$scope.output.showChart = true; 
... 

感謝。

Answer 1

簡短的回答：

包裝圖表創建於$超時（0毫秒默認的超時）工作原理：

---

龍回答：

$暫停時以延遲設置爲0消除了調用$ apply的必要性，因爲$ timeout將觸發另一個自己的$ digest循環，這在t中是這樣的甕會做所有必要的更新。

$scope.output.showChart = true; 
$timeout(function(){ 
    if($scope.lineChart){ 
     $scope.lineChart.destroy(); 
    } 
    var ctx = document.getElementById("myChart").getContext("2d"); 
    $scope.lineChart = new Chart(ctx).Line(data, chartConfig); 
});