title: stop angular-ui-router navigation until promise is resolved
body: <p>I want to prevent some flickering that happens when rails devise timeout occurs, but angular doesn't know until the next authorization error from a resource.</p>
  
  <p>What happens is that the template is rendered, some ajax calls for resources happen and then we are redirected to rails devise to login.  I would rather do a ping to rails on every state change and if rails session has expired then I will immediately redirect BEFORE the template is rendered.</p>
  
  <p>ui-router has resolve that can be put on every route but that doesn't seem DRY at all.</p>
  
  <p>What I have is this.  But the promise is not resolved until the state is already transitioned.   </p>
  
  <pre><code>$rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams){
          //check that user is logged in
          $http.get('/api/ping').success(function(data){
            if (data.signed_in) {
              $scope.signedIn = true;
            } else {
              window.location.href = '/rails/devise/login_path'
            }
          })
  
      });
  </code></pre>
  
  <p>How can I interrupt the state transition, before the new template is rendered, based on the result of a promise?</p>