title: How to use/sync data of controller in a directive?
body: <p>After some research, I'm not able to find the answer to my question.</p>
  
  <p>I have a controller that fetch datas from a db, and I put some of the datas in a table (to use elsewhere).</p>
  
  <pre><code>Employees.getEmployees() // A service that return $http.get ...
          .success(function(data) {               
              $scope.employees = data;         
          });
  
  $scope.salesData = [];
  angular.forEach($scope.employees,function(employees){
      $scope.salesData.push(employees.totalSales);
  });
  </code></pre>
  
  <p>I'd like to use this $scope.salesData in a directive, that creates a chart with D3JS.</p>
  
  <pre><code>angular.module('dirDonut', [])
  .directive("linearChart", function($window) {
  return{
      restrict: "EA",
      link: function(scope, el, attrs){
  
          // retrieve datas from the Controller
          var data=scope[attrs.chartData];
  
          // Here the code creates the chart ...
      }
    };
  });
  </code></pre>
  
  <p>Then, in the HTML :</p>
  
  <pre><code>&lt;div linear-chart chart-data="salesData"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>The problem is that the datas are not retrieved at all in the directive. I've got the error : Cannot read property 'length' of undefined.
  If I hard code the values in the Controller it will work.</p>
  
  <p>Any suggestions guys ? Sorry if I missed the answer in another post, I did not see any case like mine.</p>