title: AngularJS "Dynamic" / "Wildcard" routing
body: <p>I am using angular ui router like following:</p>
  <pre><code>angular
    .module('app', [
      'ui.router'
    ])
    .config(['$urlRouterProvider', '$stateProvider', function($urlRouterProvider, $stateProvider) {
      $urlRouterProvider.otherwise('/');
      $stateProvider
        .state('start', {
          url: '/',
          templateUrl: 'templates/start.html',
          controller: 'startCtrl'
        })
        .state('dictionary', {
          url: '/dictionary',
          templateUrl: 'templates/dictionary.html',
          controller: 'dictionaryCtrl'
        })
    }])
  </code></pre>
  <p>This works just fine.</p>
  <p>Now what I would like to do is to continue building the URL from /dictionary.</p>
  <p>Basically the dictionary will contain a repeated set of li elements which are rendered based on an array of objects.
  Note that the array of objects are retrieved from a source which may contain a different set of objects from time to time.</p>
  <pre><code>&lt;ul&gt;
        &lt;li ng-repeat=&quot;element in array&quot;&gt;
            {{element}}
        &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  <p>By clicking an element in the above list the controller will update the array and re-render the above list based on childelements to corresponding element in the source.</p>
  <h3>Now to the problem</h3>
  <p>First I would like the url to be appended like:</p>
  <pre><code>/dictionary/selectedelement
  </code></pre>
  <p>If I then would hit back in my browser I wish to return to</p>
  <pre><code>/dictionary
  </code></pre>
  <p>and if I were to bookmark</p>
  <pre><code>/dictionary/selectedelement
  </code></pre>
  <p>I wish to be able to render the list based on that last url segment.</p>
  <p>I would also like to use the same controller if at all possible.</p>