title: Nested state won't show its ui-view
body: <p>I'm working with UI-router in AngularJS and working with my nested views, I have multiple levels of states, but at one point I cannot trigger my UI-view.
  Here is my state definition:</p>
  
  <pre><code>app.config(['$stateProvider', '$urlRouterProvider',
  function($stateProvider, $urlRouterProvider) {
      $stateProvider
      .state('guest-abstract', {
          abstract: true,
          views: {
              '@': { templateUrl: 'partials/toolbar',
                      controller: 'BaseController',
                      controllerAs: 'baseCtrl'
              }
          }
      })
      .state('guest-abstract.home',{
          url: '/home',
          views: {
              'choosing': {
                templateUrl: 'partials/home',
                controller: 'choosingController',
                controllerAs: 'chooseCtrl'
            }
          }
  
      })
      .state('guest-abstract.cinemas',{
          url: '/cinemas',
          resolve: {
              initialData: function(CinemasService){
  
                      //console.log(CinemasService.loadAllCinemas());
                    return CinemasService.initialCinemasCtrlData(); 
                }
          },
          views: {
              'cinemas': {
                templateUrl: 'partials/cinemas',
                controller: 'CinemasController',
                controllerAs: 'cinemasCtrl'
            }
          }
      })
      .state('guest-abstract.theatres',{
          url: '/theatres',
          resolve: {
              initialData: function(TheatresService){
                   // console.log(TheatresService);
                    return TheatresService.initialTheatresCtrlData();   
                }
          },
          views: {
              'theatres': {
                templateUrl: 'partials/theatres',
                controller: 'TheatresController',
                controllerAs: 'theatresCtrl'
            }
          }   
      })
      .state('success',{
          url: '/success',
          templateUrl: 'partials/successMessage',
          controller: 'UserController',
          controllerAs: 'sCtrl'
      })
      .state('badToken',{
          url: '/badToken',
          templateUrl: 'partials/badtoken',
  
      })
      .state('login',{
          url: '/login',
          templateUrl: 'partials/login',
          controller: 'LoginController',
          controllerAs: 'loginCtrl'
      })
      .state('registration',{
          url: '/registration',
          templateUrl: 'partials/registration',
          controller: 'UserController',
          controllerAs: 'regCtrl'
      })
      .state('guest-abstract.profile-abstract', {
          url: '/:username',
          abstract: true,
          views: {
              'profilePage': {
                templateUrl: 'partials/profilePage'
  
            }
          }   
      })
      .state('guest-abstract.profile-abstract.profile-overview', {
          url: '/overview',
          resolve: {
              initialData: ['$stateParams', 'UserService',function($stateParams, UserService){
                    return UserService.getUser($stateParams.username);   
                }]
          },
          views: {
              'overview': {
                templateUrl: 'partials/profileOverview',
                controller: 'ProfileController',
                controllerAs: 'profCtrl'
            }
          }  
      })
      .state('guest-abstract.profile-abstract.profile-abstract-friends', {
          url: '/friends',
          abstract: true,
          views: {
              'friends': {
                templateUrl: 'partials/friends',
            }
          }  
      })
      .state('guest-abstract.profile-abstract.profile-abstract-friends.friends-list', {
          url: '/friendsList',
          resolve: {
              initialData: ['$stateParams', 'FriendsService',function($stateParams, FriendsService){
                  console.log("Usao je u resolve");
                  console.log($stateParams.username);
                  console.log(FriendsService.initialFriendsCtrlData($stateParams.username));
                  return FriendsService.initialFriendsCtrlData($stateParams.username);   
                }]
          },
          views: {
              'friendsList@guest-abstract.profile-abstract.profile-abstract-friends': {
                templateUrl: 'partials/friendsList',
                controller: 'FriendsController',
                controllerAs: 'friendsCtrl'
            }
          }  
      })
      .state('guest-abstract.profile-abstract.profile-abstract-friends.friends-search', {
          url: '/friendsSearch',
          resolve: {
              initialData: ['$stateParams', 'FriendsService',function($stateParams, FriendsService){
                  console.log("Usao je u resolve");
                  console.log($stateParams.username);
                  console.log(FriendsService.initialFriendsCtrlData($stateParams.username));
                  return FriendsService.initialFriendsCtrlData($stateParams.username);   
                }]
          },
          views: {
              'friendsSearch': {
                templateUrl: 'partials/friendsSearch',
                controller: 'FriendsController',
                controllerAs: 'friendsCtrl'
            }
          }  
      })
      .state('guest-abstract.settings-abstract', {
          url: '/settings',
          abstract: true,
          views: {
              'settingsPage': {
                templateUrl: 'partials/settingsPage'
  
            }
          }   
      })
      .state('guest-abstract.settings-abstract.general', {
          url: '/general',
          resolve: {
              initialData: ['$stateParams', 'UserService',function($stateParams, UserService){
                    return UserService.getUser($stateParams.username);   
                }]
          },
          views: {
              'general': {
                templateUrl: 'partials/generalSettings',
                controller: 'ProfileController',
                controllerAs: 'settingsCtrl'
            }
          },
          params: {
              username:null
          }  
      })
      .state('guest-abstract.settings-abstract.security', {
          url: '/security',
          resolve: {
              initialData: ['$stateParams', 'UserService',function($stateParams, UserService){
                    return UserService.getUser($stateParams.username);   
                }]
          },
          views: {
              'general': {
                templateUrl: 'partials/securitySettings',
                controller: 'ProfileController',
                controllerAs: 'securityCtrl'
            }
          },
          params: {
              username: null
          }  
      })
  </code></pre>
  
  <p>But when I put state like this it renders fine</p>
  
  <pre><code> .state('friendsList2',{
          url: '/friendsList2',
          templateUrl: 'partials/friendsList',
          controller: 'FriendsController',
          controllerAs: 'friendsCtrl',
          resolve: {
              initialData: ['$stateParams', 'FriendsService',function($stateParams, FriendsService){
                  console.log("Usao je u resolve");
                  console.log($stateParams.username);
                  console.log(FriendsService.initialFriendsCtrlData($stateParams.username));
                  return FriendsService.initialFriendsCtrlData($stateParams.username);   
                }]
          },
          params: {
              username: null
          } 
      })
      $urlRouterProvider.otherwise('/home');
  }]);
  </code></pre>
  
  <p>In my index.ftl I have just:</p>
  
  <pre><code>&lt;div ui-view&gt;&lt;/div&gt;
  </code></pre>
  
  <p>In next state I have:</p>
  
  <pre><code>     &lt;div ui-view='choosing'&gt;&lt;/div&gt;
     &lt;div ui-view='cinemas'&gt;&lt;/div&gt;
     &lt;div ui-view='theatres'&gt;&lt;/div&gt;
     &lt;div ui-view='profilePage'&gt;&lt;/div&gt;
     &lt;div ui-view='settingsPage'&gt;&lt;/div&gt;
  </code></pre>
  
  <p>In state guest-abstract.profile-abstract I have:</p>
  
  <pre><code>&lt;div ui-view='overview'&gt;&lt;/div&gt;
  &lt;div ui-view='friends'&gt;&lt;/div&gt;
  </code></pre>
  
  <p>And in state:</p>
  
  <p>'guest-abstract.profile-abstract.profile-abstract-friends'</p>
  
  <p>I have <code>&lt;div iu-view="friendsList"&gt;&lt;/div&gt;</code></p>
  
  <p>and that is where UI-view is not triggered, but when I made state without parents with that templateUrl and controllers it worked perfectly.</p>
  
  <p>It is bugging me for several hours if anyone could help me I would appreciate it!! For any other information, I am here, thanks.</p>
  
  <p>ps, I have tried every possible combination of naming. </p>