为什么angular-chartjs更新在$ timeout回调中有效但在异步回调中没有？

Question

我的页面上有一个angular-chartjs条形图：

我用一些数据初始化它：

$scope.data= [
  [1,2,3,4]
];
$scope.labels = [1,2,3,4];
$scope.series = ['field1'];

如果我在几秒钟后添加一个数据点，图表会愉快地更新：

$timeout(function() {
    console.log('timeout');
    $scope.labels.push('');
    $scope.data[0].push(9);
}, 2000);

//the data gains a 9, and the chart updates and now has 5 bars,
//rather than 4.

但是如果我尝试在异步回调中做同样的事情，那就会出现严重错误，并且图表无法完全呈现。

$http.get( _url_ ).then(function(res) {
     $scope.labels.push('');
     $scope.data[0].push(9);
});
//perhaps something goes wrong behind the scenes with $scope.data
//because the chart wont load now

为什么在ajax请求的回调中做内容会使图表不满意？

编辑：here's a plunker，但出于某种原因，它在plunker中工作正常，但在实际应用程序中却没有。