title: Simplifying nested promises and loops
body: <p>I'm building an angular app and i'm trying to understand better about promises
  When i'm dealying with async calls (like $http) what i usually do is wrap them in a service then call them in my controllers like this:</p>
  
  <pre><code>...
  
  function whatever(arguments) {
      dataService.getUser(arguments)
          .then(onUserComplete)
          .then(dataService.getExtra)
          .then(onExtraComplete)
          .catch(onError);
  
      function onUserComplete(user) {
          //do something with user
          ...
          // return user id (because we are
          // supposing that getExtra is
          // requiring an id as argument)
          return user.id;
      }
  
      function onExtraComplete(extra) {
          // do something with extra
          // no need to return anything,
          // we are the last element of the
          // chain.
      }
  
      function onError(error) {
          console.log(error);
      }
  }
  
  ...
  </code></pre>
  
  <p>This help me keeping every function understandable and maintenable, easy to read and consistent... at least until i need to deal with collection.
  Suppose that i need to do the same thing as before, but instead of having one user, i'm getting the entire collection of user (and i still need to obtain the extra data of each single user).
  What i did is this:</p>
  
  <pre><code>...
  
  function whatever(arguments) {
      dataService.getUsers(arguments)
          .then(onUsersComplete)
          .catch(onError);
  
      function onUsersComplete(users) {
          users.forEach(function(user) {
              dataService.getExtra(user.id)
                  .then(onExtraComplete)
                  .catch(onError);
          });
      }
  
      ...
  }
  
  ...
  </code></pre>
  
  <p>Is this the best that i can obtain trying to follow my coding style? 
  Is even possible to resolve my problem with a single promise chain?
  Thanks</p>