title: Angular UI-Router open modal window on url change
body: <p>I use angular-ui-router and angular-bootstrap in my project.</p>
  
  <p>I want to implement follow use case:</p>
  
  <p>When user click to "edit" button, UI-Router change URL and open modal window. When I go back by click on browser's back button, modal window is closing.</p>
  
  <p>If user reload page when modal window is opened, application should render modal window content in main ui-view container.</p>
  
  <p>This use case you can see on this sire: <a href="http://canopy.co/">http://canopy.co/</a> (try to click on item and reload page)</p>
  
  <p><strong>Question</strong>: How to implement behaviour described above?</p>
  
  <p>Here is my jsFiddle <a href="http://jsfiddle.net/sloot/ceWqw/3/">http://jsfiddle.net/sloot/ceWqw/3/</a></p>
  
  <pre><code>var app = angular.module('myApp', ['ui.router', 'ui.bootstrap'])
  .config(function ($stateProvider, $urlRouterProvider) {
  
    $urlRouterProvider.otherwise('/');
    $stateProvider
      .state('app', {
        url: '/',
        controller: 'AppCtrl',
        templateUrl: '/views/app.html'
      })
      .state('item', {
        url: '/profile',
        controller: 'ItemCtrl',
        templateUrl: '/views/item.html'
      });
  })
  .controller('AppCtrl', function($scope, $modal, $state){
    $scope.open = function(){
  
      // open modal whithout changing url
      $modal.open({
        templateUrl: '/views/item.html'
      });
  
      // I need to open popup via $state.go or something like this
    };
  })
  .controller('ItemCtrl', function(){});
  </code></pre>