title: Nested states with angular-ui-router redirected to the parent state
body: <p>I am trying to create Nested States with <code>ui-routes</code> on AngularJS:</p>
  
  <pre><code>.state('compare', {
      url: '/compare',
      templateUrl: '/views/compare.list.html',
      controller: 'CompareListCtrl'
  })
  
  .state('compare.compare', {
      url: '/compare',
      templateUrl: '/views/compare.table.html',
      controller: 'CompareTableCtrl'
  })
  
  .state('compare.compareTwo', {
      url: '/:models',
      templateUrl: '/views/compareTwo.html',
      controller: 'CompareTwoCtrl'
  })
  </code></pre>
  
  <p>If I go to <code>compare/compare</code> or <code>compare/thinkpad-t400-and-thinkpad-x200</code>, url stays the same but  <code>"compare"</code> state view and controller shows.</p>
  
  <p><strong>Why is that and how can I fix that?</strong></p>