title: AngularJS - error: [$rootscope:infdig] 10 $digest() iterations reached
body: <p>I'm new to AngularJS and am running into a problem.</p>
  
  <p>I have a JSON array of invoices retrieved via a $http GET request that is being looped through here:</p>
  
  <pre><code>  &lt;a ng-repeat="invoice in invoices" href="#" class="list-group-item"&gt;
      {{ invoice[data]["TxnDate"][0] }} -
      {{ invoice[data]["DocNumber"][0] }} - 
      ${{ invoice[data]["TotalAmt"][0] }} - 
      {{ getCustomer(invoice[data]["Id"][0]) }}
  
      &lt;i class="fa fa-chevron-right pull-right"&gt;&lt;/i&gt;
      &lt;i class="pull-right"&gt;Edit&lt;/i&gt;
    &lt;/a&gt;
  </code></pre>
  
  <p>The problem is that the array of invoices does not store any information about the customer except for the customer's reference number.</p>
  
  <p>So, I created a function called <code>getCustomer</code> which queries my API for the customer's name by their reference number.</p>
  
  <pre><code>$scope.getCustomer = function(id) {
  
      var customer_id = id.match(/\d+/)[0];
  
      $http.post('/customers', customer_id).success(function(response) {
          console.log(response);
      });
  
  };
  </code></pre>
  
  <p>The problem is I am receiving this error:  </p>
  
  <pre><code>error: [$rootscope:infdig] 10 $digest() iterations reached. aborting! watchers fired in the last 5 iterations: []
  </code></pre>
  
  <p>Later, I will figure out a more efficient way to do this but I'm curious to know what is causing this error?  </p>
  
  <p>After doing some research, I think it has something to do with the fact that once the data in one of the list items changes, AngularJS needs to check all the list items.  Still, I'm very confused.  What is the right way of doing this?</p>