Javascript 在HTML5画布上绘制条形图，然后清除它以重新绘制isn'；行不通

我有一个AngularJS指令，用于绘制一个小条形图。条形图的数据通过每分钟运行的ajax请求获取。第一次通过时，条形图绘制得很好。下一次，我想清除画布，并用新获取的值重新绘制条形图。但是，当我清除画布时，条形图不会被重新绘制

angular.module('statsApp')
  .directive('miniChart', function () {
    return {
      template: '<canvas width="100" height="50"></canvas>',
      restrict: 'E',
      replace: 'true',
      scope: {
        values: '=',
        property: '@',
        color: '@',
        colorZero: '@'
      },
      link: function(scope, element) {
        var posX = 0;
        var canvas = element[0];
        scope.$watch('values', function(values) {
          if(values) {
            var barMargin = 3;
            var barWidth = Math.abs(canvas.width / 7) - barMargin;
            var ctx = canvas.getContext('2d');
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            angular.forEach(values, function(value) {
              console.debug(value);
              ctx.fillStyle = value[scope.property] > 0 ? scope.color : scope.colorZero;
              var rectHeight = value[scope.property] + 1;
              ctx.fillRect(posX, Math.abs(rectHeight - canvas.height), barWidth, rectHeight);
              posX += (barWidth + barMargin);
            });
          }
        });
      }
    };
  });

angular.module（'statsApp'））
.指令（'miniChart'，函数（）{
返回{
模板：“”，
限制：'E'，
替换为：“true”，
范围：{
值：'='，
属性：“@”，
颜色：“@”，
colorZero:“@”
},
链接：功能（范围、元素）{
var-posX=0；
var canvas=元素[0]；
范围.$watch（'values'，函数（values）{
如果（值）{
var barMargin=3；
var barWidth=Math.abs（canvas.width/7）-barMargin；
var ctx=canvas.getContext（'2d'）；
clearRect（0，0，canvas.width，canvas.height）；
角度。forEach（值，函数（值）{
console.debug（值）；
ctx.fillStyle=value[scope.property]>0？scope.color:scope.colorZero；
var rectHeight=值[scope.property]+1；
fillRect（posX、Math.abs（rectHeight-canvas.height）、barWidth、rectHeight）；
posX+=（条宽+条边距）；
});
}
});
}
};
});

不确定如何从服务器填充值，但您的手表可能需要在之后传递的true参数来执行如下完整检查：

scope.$watch('values', function(values) {
    ...
}, true);

---

下面是上面的文档：$rootScope.Scope#$watch

我使用AngularJS工厂获取数据，该工厂只使用$http获取数据。我将尝试添加该布尔值，看看它是否成功。