title: Angularjs - refresh `d3js` chart when data change
body: <p>I created a <code>directive</code> for my <code>d3js</code> chart:</p>
  
  <pre><code>html:
  &lt;donuts-chart chart-data="mydonuts" &gt;&lt;/donuts-chart&gt;
  
  directive:
  .directive('donutsChart', function ($parse) {
  var donutobject = {
      restrict: 'E',
      replace: false, 
      scope: {data: '=chartData'},
      link: function (scope, element, attrs) {
  
        scope.$watch('data', function(newVals, oldVals) {
          console.log('there is new data');
        }, true);
  
            };
      return donutobject;
     })
  </code></pre>
  
  <p>I add <code>scope.$watch</code> just to test if the data is updating. But it is not working. How can I get this to work? I need to update the chart whenever there is a new data.</p>