title: How to close modal after transition to another modal on angular ui router
body: <p>I'm using <a href="https://github.com/angular-ui/ui-router" rel="nofollow">angular ui router</a> to open modals.</p>
  
  <p>I have two states with modals:</p>
  
  <ol>
  <li><code>'modal.first'</code></li>
  <li><code>'modal.second'</code></li>
  </ol>
  
  <p><strong>What I want is to close the first modal by button click and change state to <code>'modal.second'</code>.</strong></p>
  
  <p>The problem is that i can only close modal <strong>or</strong> change state (but first modal still open).</p>
  
  <p>Here state definitions:</p>
  
  <pre><code>$stateProvider
      .state('modal.first', {
          url: '/first',
          onEnter: function ($state, $modal) {
              $modal.open({
                  templateUrl: 'some_url',
                  controller: 'FirstCtrl',
                  resolve: {
                      //...
                  }
                              }
              }).result.finally(function () {
                  $state.go('^');
              });
          }
      })
  </code></pre>
  
  <p>The second modal definition is all the same (with state name <code>modal.second</code> and url <code>/second</code>).</p>
  
  <p>I'm trying to close modal (and change state) like this:</p>
  
  <p>(<code>FirstController</code>)</p>
  
  <pre><code>$scope.goSecond = function () {
      $state.go('modal.second', $stateParams);
      $modalInstance.close();
  };
  </code></pre>
  
  <p>But this didn't work. I able to choose only one - or <code>$state.go(...)</code>, or <code>$modalInstance.close()</code>.</p>
  
  <p>I think maybe i should take more attention to the <code>.finally()</code> block. But still have no ideas. Thanks.</p>
  
  <p>Link to the official FAQ with modals: <a href="https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions#how-to-open-a-dialogmodal-at-a-certain-state" rel="nofollow">click</a></p>
  
  <p><strong>UPDATE</strong> I cannot just change state in finally without any statements, because I'm need to change state only by clicking the button (and make <code>.go('^')</code> in any other cases).</p>