How to set default child view with Angular UI Router

Question

Let\'s say I have the following 3 Angular UI Router states:

$stateProvider
    .state(\'adminCompanies\', {
        abstract: true,
        url: \"/admin/com         


        

Answer 1

You can also use ui-router-default - a module where default child states are defined in the parent state by setting abstract: ".defaultChild".

This has the benefit of being able to use ui-sref="parent" and $state.go("parent"); (which was important for me when dynamically creating a navbar).

NB: Both this and David's solution only work if the parent state is abstract - i.e. the parent cannot be active without a child being active - which should be the case when we want to have a "default" child view.

(See also the ui-router team's relevant discussion here.)