Angular UI-Router Unable to create a nested state for parent state with url '/' but succeeding incase of parent with url '/something'?

Question

If I am defining a router configuration as :

export function routerConfig($stateProvider, $urlRouterProvider, $locationProvider) {
  'ngInject';
  $locationProvider.html5Mode(true);

  $stateProvider
    .state('myapp', {
      url: '/',
      templateUrl: 'app/main/main.html',
      controller: 'MainController',
      controllerAs: 'main'
    })
    .state('searchResults', {
      url: '/search',
      parent: 'myapp',
      templateUrl: 'app/search-results/search-results.html',
      controller: 'SearchResultsController',
      controllerAs: 'srchRes'

    });

  $urlRouterProvider.otherwise('/');
}

When I try hitting http://localhost/search , I am getting redirected to http://localhost. I don't know the reason why?

But this code is working :

export function routerConfig($stateProvider, $urlRouterProvider, $locationProvider) {
  'ngInject';
  $locationProvider.html5Mode(true);

  $stateProvider
    .state('myapp', {
      url: '/myapp',
      templateUrl: 'app/main/main.html',
      controller: 'MainController',
      controllerAs: 'main'
    })
    .state('searchResults', {
      url: '/search',
      parent: 'myapp',
      templateUrl: 'app/search-results/search-results.html',
      controller: 'SearchResultsController',
      controllerAs: 'srchRes'

    });

  $urlRouterProvider.otherwise('/');
}

Now when I do http://localhost/myapp/search is working perfectly.

Can't nested states be created out of states with the "url" property set to "/" root?

Austin · Accepted Answer · 2016-03-22 20:59:49Z

1

I believe that the url property is optional and if you remove it from the parent you should be able to navigate to the child without any issues

answered Mar 22, 2016 at 20:59

Austin

1,29110 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Rohit Rane Over a year ago

Thank you. Worked perfectly.

Collectives™ on Stack Overflow

Angular UI-Router Unable to create a nested state for parent state with url '/' but succeeding incase of parent with url '/something'?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related