Here is my code:

.state('profile',{ 
        url : '/profile',
        templateUrl: 'views/user.html', 
        controller: 'UserCtrl'
      })
      .state('profile.forgot',{ 
        url : '/delivers',
        templateUrl: 'views/user_forgot.html', <- this template not appear, when state is active
        controller: 'forgotCtrl'
      })

<a ui-sref="profile.forgot">Forgot your pasword?</a>
<div class="panel" ui-view=""></div>

When i click on link, in ui-view appeared template and controller of parent state. AngularJS version is 1.2.0-rc.2

Here is my code:

.state('profile',{ 
        url : '/profile',
        templateUrl: 'views/user.html', 
        controller: 'UserCtrl'
      })
      .state('profile.forgot',{ 
        url : '/delivers',
        templateUrl: 'views/user_forgot.html', <- this template not appear, when state is active
        controller: 'forgotCtrl'
      })

<a ui-sref="profile.forgot">Forgot your pasword?</a>
<div class="panel" ui-view=""></div>

When i click on link, in ui-view appeared template and controller of parent state. AngularJS version is 1.2.0-rc.2

• javascript
• angularjs
• angular-ui
• angular-ui-router

• I'm having the same issue here, using 1.2.0-rc.3. Have you found a solution for this, if at all? – Nick Commented Nov 1, 2013 at 15:42
• Phil Thomas' answer below is correct. Please accept it. – martijnve Commented Jan 19, 2014 at 1:41
• @Nick Have u fixed this ?, i am having same problem – vimal1083 Commented Aug 17, 2014 at 14:27
• Based on Phil's information, nested states/routes are not working as you expect, simply avoid it, use sth like .state('profile-forgot')... instead. – Rob Lao Commented Nov 20, 2016 at 14:33

2 Answers 2

A nested state will render within the ui-view element of its parent template (which, if parentless, renders within the root ui-view). Make sure you read the 'Nested States & Views' section of the docs.

Please Pay attention to parent-child naming convention!

.state('profile.forgot',{ 
        url : '/forgot',
        templateUrl: 'views/profile.forgot.html',
        controller: 'forgotCtrl'
      })