title: angular api calls in loops / functions in specific order
body: <p>I've lost count of how many times I've tried to make this work.  I just don't get it.</p>
  
  <p>Let's pretend I have the following API calls:</p>
  
  <p>api/customer(cust)</p>
  
  <p>api/orders(orderid)</p>
  
  <p>api/products(productid)</p>
  
  <p>api/related(relatedid)</p>
  
  <p>When all is said and done, I need a single object that contains all the data as arrays and sub arrays (will explain below).</p>
  
  <p>I need to start by doing an api call to api/customer.  The return is going to be that customer's previous orders as an array of objects.  Let's pretend they made three orders.</p>
  
  <p>Inside each object is various key : value pairs, including one called "products" which itself is an array of productid numbers.</p>
  
  <p>Now I must loop through all the product id numbers and with each one, call:</p>
  
  <p>api/products(productid)</p>
  
  <p>This also will return an array which must be looped through to find each product's "relatedid" value.</p>
  
  <p>Then inside the above loop I must once again contact the API with:</p>
  
  <p>api/related(relatedid)</p>
  
  <p>Which then returns all the products related to each product in each order of each customer.</p>
  
  <p>When all is said and done a single customer might have three orders, and each order could have 5 products and each product could have 10 related products.</p>
  
  <p>How do you code something like this, making sure that each API call from the top down completes before continuing on?  How do you do that inside multiple loops?</p>
  
  <p>When all is said and done I'm hoping for something like this:</p>
  
  <pre><code>{
  customerid: 10
  previousOrderids: {10, 11, 12}  
  orderedProducts: {10: {101, 102, 103, 104}, 11:{201, 202, 203, 204}, 12:{301, 302}
  relatedProducts: {101: {5, 6, 7}, 102: {7,8,9} } (etc...)
  }
  </code></pre>
  
  <p>and so on.  I've left the above short for brevity, but i'm hoping it's obvious I am trying to build a "tree" of data where I start with a single API call with static data (the customer's id) and then from there, make calls using what is in the API responses.</p>
  
  <p>I know about defered promises, $q.all, .then, etc etc.  But everything I try just gets me going around in circles.  Forget about even making nice compact functions to handle each bit.  I understand the basics, but I have never seen an actual real world example of how to assemble something complicated.</p>
  
  <p>Can someone help me understand how to handle multiple asynchronous actions where each one depends on the results of the one before it?  And especially where multiple async actions must be called in various loop(s) and completed before moving on?</p>
  
  <p>I've done things like this in server side languages like PHP, but those are easy when the code won't advance until the current action is done.</p>
  
  <p>I'd post some of the code I've tried, but it's a total joke.</p>
  
  <p>Thank you.</p>