title: Nested State problems
body: <p>I'm trying to insert a nested state under "home" (main directory) without success. I've read the Nested States documentation on agularjs.</p>
  
  <p>Here is my main.html :</p>
  
  <pre><code>&lt;div id="wrapper"&gt;
      &lt;div ng-include="'scripts/app/main/leftmenu.html'"&gt;&lt;/div&gt;
      &lt;div id="page-wrapper" class="gray-bg"&gt;
          &lt;!-- Page wrapper --&gt;
          &lt;div ng-include="'scripts/app/main/topnav.html'"&gt;&lt;/div&gt;
          &lt;!-- Main view  --&gt;
          &lt;div ui-view="mainview"&gt;&lt;/div&gt;
          &lt;!-- Footer --&gt;
          &lt;div ng-include="'scripts/app/main/footer.html'"&gt;&lt;/div&gt;
      &lt;/div&gt;
      &lt;!-- Right Sidebar --&gt;
      &lt;div ng-include="'scripts/app/main/rightsidebar.html'"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>My main.js :</p>
  
  <pre><code>'use strict';
  
  angular.module('foremnetApp')
      .config(function ($stateProvider) {
          $stateProvider
              .state('home', {
                  parent: 'site',
                  url: '/',
                  data: {
                      authorities: ['ROLE_USER']
                  },
                  views: {
                      'content@': {
                          templateUrl: 'scripts/app/main/main.html',
                          controller: 'MainController'
                      }
                  },
                  resolve: {
                      mainTranslatePartialLoader: ['$translate', '$translatePartialLoader', function ($translate, $translatePartialLoader) {
                          $translatePartialLoader.addPart('main');
                          return $translate.refresh();
                      }]
                  }
              })
      });
  </code></pre>
  
  <p>My dashboard1.js</p>
  
  <pre><code>angular.module('foremnetApp')
      .config(function ($stateProvider) {
          $stateProvider
              .state('dashboard1', {
                  parent: 'home',
                  url: '/dashboard1',
                  data: {
                  },
                  views: {
                      'mainview': {
                          templateUrl: 'scripts/app/main/dashboard1/dashboard1.html',
                          controller: 'Dashboard1Controller'
                      }
                  },
                  resolve: {
                      mainTranslatePartialLoader: ['$translate', '$translatePartialLoader', function ($translate, $translatePartialLoader) {
                          $translatePartialLoader.addPart('main');
                          return $translate.refresh();
                      }]
                  }
              })
      });
  </code></pre>
  
  <p>When I try to go to "<a href="http://localhost:3000/#/dashboard1" rel="nofollow">http://localhost:3000/#/dashboard1</a>", I return to my default route... Also, I'd like to make the "home" state an abstract one (like "account").</p>
  
  <p>Thanks for your help.</p>