title: How to make synchronous AJAX requests in AngularJS controller
body: <p>I've been told that $http in Angular is asynchronous. However, for some purpose, I need to make sequential AJAX requests.
  I want to read all the files from a file list, and then get the number from all those files. For example:</p>
  
  <p>content of "fileNames":</p>
  
  <pre><code>file1
  file2
  </code></pre>
  
  <p>content of "file1": </p>
  
  <pre><code>1
  </code></pre>
  
  <p>content of "file2":</p>
  
  <pre><code>2
  </code></pre>
  
  <p>The following code will calculate the sum</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;body&gt;
  &lt;p id="id01"&gt;&lt;/p&gt;
  &lt;script src="http://code.jquery.com/jquery-1.11.3.min.js"&gt;&lt;/script&gt;
  &lt;script&gt;
  
  var fileString;
  /* first AJAX call */
  $.ajax({
      url: 'fileNames', type: 'get', async: false,
      success: function(content) {
          fileString = content;
      }
  });
  var fileList = fileString.split('\n');
  var sum = 0;
  for (var i = 0; i &lt; fileList.length; i++) {
        /* second AJAX call in getNumber function */
        sum += getNumber(fileList[i]);
  }
  document.getElementById("id01").innerHTML = sum;
  
  function getNumber(file) {
      var num;
      $.ajax({url: file, type: 'get', async: false,
        success: function(content) {
              num = content;
          }
      });
      return parseInt(num);
  }
  
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Since the two $.ajax calls are sequential, I don't know how to achieve this functionality in AngularJS. Say, in the end, I want $scope.sum = 1 + 2.</p>
  
  <p>Can someone make it work in AngularJS? Some simple code would be appreciated!</p>