title: $q.all with nested promise also created with $q.all
body: <p>The following function tries to return a promise that will only resolve when all the async HTTP calls have finished:</p>
  
  <pre><code>$scope.saveThat = function () {
      var promises = [];
  
      for (var i = 0; i &lt; array.length; i++) {
          var newPromise = $q.defer();
          promises.push(newPromise);
  
          // some more code...
  
          (function (i, newPromise) {
              $http(httpData)
                  .success(function (response) {
                      newPromise.resolve('Success');
                  })
                  .error(function (response) {
                      newPromise.reject('Error');
                  });
          })(i, newPromise);
  
      }
      return $q.all(promises);
  };
  </code></pre>
  
  <p>And the following snippet calls this function.</p>
  
  <pre><code>// save this...
  var promise1 = $rootScope.saveThis(result.Person);
  promise1.then(function (success) {
      }, function (error) {
          saveErrorMessage += 'Error saving this: ' + error + '.';
      });
  
  // save that...
  var promise2 = $rootScope.saveThat(result.Person);
  promise3.then(function (success) {
      }, function (error) {
          saveErrorMessage += 'Error saving that: ' + error + '.';
      });
  
  // wait until all promises resolve
  $q.all([promise1, promise2])
  .then(
      function (success) {
          $scope.$emit(alertEvent.alert, { messages: 'Saved successfully!', alertType: alertEvent.type.success, close: true });
      }, function (error) {
          $scope.$emit(alertEvent.alert, { messages: saveErrorMessage, alertType: alertEvent.type.danger });
      });
  </code></pre>
  
  <p>The problem I have is that the second promise (<code>$q.all([promise1, promise2])</code>) resolves even when the promises in promise2 haven't resolved yet.</p>