title: AngularJS: $routeProvider when resolve $http returns response obj instead of my obj
body: <p>I'm trying to resolve a couple ajax calls so that data my controller needs is available before it (and a directive it furnishes) execute. The order of execution is working, however, instead of returning the object I create, the result injected into my controller is $http's response object:</p>
  
  <pre><code>{
    config: { … },
    data: { … },
    headers: { … },
    status: 200
  }
  </code></pre>
  
  <p>My code essentially looks like:</p>
  
  <pre><code>app.config([
    '$routeProvider', function($routeProvider)
    {
      $routeProvider
        .when('/path', {
          …,
          "resolve": {
            "data": [
              '$http',
              function($http)
              {
                return $http
                  .get('/api/data')
                  .success(function(data,status) { return data.rows[0]; })
                  .error(function(data,status)   { return false; });
              }
            ]
          }
        });
    }
  ]);
  </code></pre>
  
  <p>Am I daft? Shouldn't the return value from $http's success actually be what is returned by $http?</p>
  
  <p>I also tried</p>
  
  <pre><code>…
  "resolve": {
    "data": [
      '$http',
      function($http)
      {
        var response;
        $http
          .get('/api/data')
          .success(function(data,status) { response = data.rows[0]; })
          .error(function(data,status)   { response = false; });
        return response;
      }
    ]
  }
  </code></pre>
  
  <p>But then the <code>data</code> object injected into my controller was undefined (I'm guessing because $http is asynchronous and <code>resolve</code> was not blocked by $http—so it returned before $http was ready).</p>
  
  <p>P.S. The synchronicity of $http should be definable in its options object!!</p>
  
  <h1>Solution</h1>
  
  <pre><code>app.config([
    '$routeProvider', function($routeProvider)
    {
      $routeProvider
        .when('/path', {
          …,
          "resolve": {
            "data": [
              '$http',
              function($http)
              {
                return $http
                  .get('/api/data')
                  .then(
                    function success(response) { return response.data.rows[0]; },
                    function error(reason)     { return false; }
                  );
              }
            ]
          }
        });
    }
  ]);
  </code></pre>
  
  <p>Thanks to <a href="https://stackoverflow.com/a/17706764/758177">Ajay beniwal's pointer</a> and <a href="https://stackoverflow.com/questions/17706419/angularjs-routeprovider-when-resolve-http-returns-response-obj-instead-of-my#comment25803901_17706419">Mark Rajcok's pointer</a>.</p>
  
  <p>P.S. <code>then()</code> is documented on <a href="http://docs.angularjs.org/api/ng.$q#Description" rel="nofollow noreferrer" title="$q promise"><strong>$q</strong>'s page</a>.</p>