Angular $q.all() Performing two simultaneous ajax requests with AngularJS.

<!DOCTYPE html>
<html>

  <head>
    <link data-require="bootstrap-css@3.2.0" data-semver="3.2.0" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" />
    <link rel="stylesheet" href="style.css" />
  </head>

  <body ng-app="app" ng-cloak>
    <div ng-controller="mainController">
      <h2>Github Users</h2>
      <div class="results" ng-hide="hideResults">
          <pre>{{github.users}}</pre>
      </div>
      <hr />
      <h2>Github Repositories</h2>
      <div class="results" ng-hide="hideResults">
          <pre>{{github.repositories}}</pre>
      </div>
  </div>
    
    <script data-require="angular.js@1.3.0-beta.5" data-semver="1.3.0-beta.5" src="https://code.angularjs.org/1.3.0-beta.5/angular.js"></script>
    <script src="script.js"></script>
  </body>

</html>

angular.module('app', [])
    .controller('mainController', function ($scope, $http, $q, $interval) {
        $scope.github = {};
        $scope.hideResults = true;
        
        function getGithubData() {
          $scope.hideResults = true;
          $q.all({
            users: $http.get('https://api.github.com/users'),
            repos: $http.get('https://api.github.com/repositories')
          }).then(function(results) {
            $scope.github.users = JSON.stringify(results.users.data, null, 2);
            $scope.github.repositories = JSON.stringify(results.repos.data, null, 2);
            $scope.hideResults = false;
          });
        }
        
        $interval(getGithubData, 2000, 3);
    });

/* Styles go here */

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
  display: none !important;
}

.results {
  height: 250px;
  overflow-y: scroll;
}