角度上的D3：更改数据对象不刷新图表

Question

我有一个更改数据的按钮

$scope.changeData = function(){
    $scope.myData = [10, 80, Math.floor((Math.random()*30)+1)];
}

以及使用此数据的指令。

<bars-chart chart-data="myData"></bars-chart>

我认为应该有一些双向绑定，如果我转储了值，它会显示在视图上，但它不会再次调用链接函数。

我在这里做错了吗？ http://codepen.io/anon/pen/QwWqpa

Answer 1

因为d3不是有角度的，所以你需要设置一个观察者才能使它工作。在观察者中嵌入链接函数中的所有逻辑，如下所示：

link: function (scope, element, attrs) {
  scope.$watch(function(){
    // all logic here
  });
}

现在唯一的问题是，这将继续追加新图表，而不是替换当前图表，但这可能是因为您使用chart.append("div")。我认为在d3中有一个不同的功能，你应该用它代替追加。

或者，您可以将创建逻辑放在观察者之外，并编写额外的代码以在观察者中更新图表。