title: ui-router default child state not working
body: <p>I'm testing <code>UI-Router</code> nested state, but I'm not able to set default state in parent/child scenario, please help.</p>
  
  <p><strong>libraries:</strong></p>
  
  <ul>
  <li>angular 1.3.15  </li>
  <li>ui router: 0.2.15</li>
  </ul>
  
  <p>navigation path:</p>
  
  <pre><code>/ - home
  /settings - parent state/page
  /settings.default - child 1
  /settings.mail - child 2
  /settings.phone - child 3
  </code></pre>
  
  <p><strong>expected behavior:</strong></p>
  
  <p>when navigating to <code>/settings</code>, the default child 'general' state/page should be triggered/loaded</p>
  
  <p><strong>actual behavior:</strong></p>
  
  <p>If I set 'settings' state 'abstrat: true', there will be error:</p>
  
  <pre><code>Error: Cannot transition to abstract state 'settings'
      at Object.transitionTo (angular-ui-router.js:3143)
      at Object.go (angular-ui-router.js:3068)
      at angular-ui-router.js:4181
      at angular.js:16299
      at completeOutstandingRequest (angular.js:4924)
      at angular.js:5312
  </code></pre>
  
  <p>If I remove 'abstrat: true', there's no error, but when i navigate to /settings, default child state/page - general state not triggered, settings.html displayed but  not loaded</p>
  
  <p><strong>app.js:</strong></p>
  
  <pre><code>angular.module('test',['ui.router','sails.io'])     //config routing
  .config(['$stateProvider','$urlRouterProvider','$locationProvider',
          function($stateProvider,$urlRouterProvider,$locationProvider) {
  
    $urlRouterProvider.otherwise('/');    
    $locationProvider.html5Mode(true);
  
    $stateProvider
      .state('home', {
          url: '/',
          templateUrl: 'views/index.html',
          controller: 'IndexController'
      })
      .state('settings', {
          abstract: true,
          url: '/settings',
          templateUrl: 'views/settings.html',
          controller: 'SettingsController'
      })
      .state('settings.general', {
          url: '',
          templateUrl: 'views/settings/general.html',
          controller: 'SettingsController'
      })
      .state('settings.mail', {
          url: '/mail',
          templateUrl: 'views/settings/mail.html',
          controller: 'SettingsController'
      })
      .state('settings.phone', {
          url: '/phone',
          templateUrl: 'views/settings/phone.html',
          controller: 'SettingsController'
      });
  }]);
  </code></pre>
  
  <p><strong>views/settings.html</strong></p>
  
  <pre><code>&lt;div class="container"&gt;
    &lt;div class="row"&gt;
      &lt;div class="col-md-3"&gt;
        &lt;ul class="list-group"&gt;
          &lt;li class="list-group-item"&gt;&lt;a ui-sref=".general"&gt;General&lt;/a&gt;&lt;/li&gt;
          &lt;li class="list-group-item"&gt;&lt;a ui-sref=".phone"&gt;Phone&lt;/a&gt;&lt;/li&gt;
          &lt;li class="list-group-item"&gt;&lt;a ui-sref=".mail"&gt;Mail&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;div class="col-md-9"&gt;
        &lt;div ui-view&gt;&lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>