title: angular.js:10126 Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting! error with nvd3 js
body: <p>I am trying to plot a line-graph using nvd3(<a href="http://krispo.github.io/angular-nvd3/#/" rel="nofollow noreferrer">http://krispo.github.io/angular-nvd3/#/</a>). The graph is inside an ng-repeat.</p>
  
  <p>HTML Code:</p>
  
  <p>Here i am passing an obj to from the array to the nvd3 graph, which is able to plot the line-graph. I have tried passing the orderItem.forecast directly to nvd3 instead of calling the function.</p>
  
  <pre><code>&lt;div class="parent_div" ng-repeat="orderItem in array"&gt;
   &lt;div class="col-md-4 overflow-graph"&gt;
    &lt;nvd3 options="options" data="plotGraph(orderItem)" class="with-3d-shadow with-transitions" ng-cloak&gt;&lt;/nvd3&gt;
   &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Controller Code :</p>
  
  <p>The values against which i need to plot the graph are stored in orderItem.forecast. In plotGraph() I am returning the the current orderItem.forecast from which the graph is plotted.</p>
  
  <pre><code>$scope.options = {
      chart: {
          type: 'lineChart',
          height: 250,
          margin: {
              top: 20,
              right: 20,
              bottom: 40,
              left: 55
          },
          x: function(d) {
              return d.converted_date },
          y: function(d) {
              return d.cases_count },
          xAxis: {
              axisLabel: 'Date',
              tickFormat: function(d) {
                  return d3.time.format('%m-%d-%y')(new Date(d));
              }
          },
          yAxis: {
              axisLabel: 'Quantity',
              tickFormat: function(d) {
                  return d;
              },
              axisLabelDistance: -10,
          }
      }
  };
  
  /*Random Data Generator */
  $scope.plotGraph = function(orderItem) {
  
      //Line chart data should be sent as an array of series objects.
      return [{
          values: orderItem.forecast, //values - represents the array of {x,y} data points
          key: orderItem.plu_code.commodity, //key  - the name of the series.
          color: '#ff7f0e', //color - optional: choose your own line color.
          strokeWidth: 2,
          classed: 'dashed'
      }];
  };
  </code></pre>
  
  <p>Once the graph is plotted, i get an error, which freezing the browser on a couple of occassions, or the browser is slow to respond.</p>
  
  <p>angular.js:10126 Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!</p>
  
  <p>Thanks.</p>