$location.path('/url') not working

Question

Following is my ui-router config. 'home' is the parent state and 'batches' is one child state among many others.

//config  
.state('home',{
    url:'/home',
    templateUrl:'../views/sidenav/home.htm',
    controller: 'homeController',
    controllerAs: 'home'
  })

  .state('batches',{
    parent:'home',
    url:'/batches',
    templateUrl:'../views/sidenav/batches.htm',
    controller: 'batchesController',
    controllerAs: 'batches'
  })

Problem is 'home' has an empty view except for the side navigation bar. So, I want it to redirect the user to 'batches' state whenever it tries to go to 'home' state. I'm trying the following to achieve that but it's not working.

$rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams){
    if(toState.name=='home'){  //home is a parent state
      $location.path('/home/batches'); //batches is a child state of home 
    }
  });

Answer 1

set you home state as abstract and that abstract state will have the htm with navbar.

check the ui-router wiki for it.

https://github.com/angular-ui/ui-router/wiki/Nested-States-and-Nested-Views

and check the dependecy injection for $location