title: Redirect a state to default substate with UI-Router in AngularJS
body: <p>I'm creating a tab based page which shows some data. 
  I'm using UI-Router in AngularJs to register states.</p>
  
  <p>My aim is to have one default tab open on page load. Each tab have sub tabs, and I would like to have a default sub tab open when changing tabs.</p>
  
  <p>I was testing with <code>onEnter</code> function and inside I'm using <code>$state.go('mainstate.substate');</code> but it seems not to work due to loop effect issues (on state.go to substate it calls its parent state and so on, and it turns into a loop).</p>
  
  <pre><code>$stateProvider
  
  .state('main', {
    url: '/main',
    templateUrl: 'main.html',
    onEnter: function($state) {
      $state.go('main.street');
    }
  })
  
  .state('main.street', {
    url: '/street',
    templateUrl: 'submenu.html',
    params: {tabName: 'street'}
  })
  </code></pre>
  
  <p>Here I created a <a href="http://plnkr.co/edit/I88iqp7bElh1wNgBGU9f?p=preview" rel="noreferrer">plunker demo</a>.</p>
  
  <p>For now everything works, except that I don't have the default tab open and that's exactly what I need.</p>
  
  <p>Thank you for your suggestions, opinions and ideas.</p>