Angular ui-router default state for no url states

We have a couple of states for one page, so states don't have a url assigned to them. Is there a way to specify the default state for URL free states? Perhaps it looks like $urlRouterProvider.otherwise('/');

.

I tried to navigate to the state in an Angular statement run

or inside a controller, but that throws an error transition superseded

that is probably due to $state

not being initialized.

Below is a short example. I would like to start right at stateA

.

angular
  .module('myModule')
  .config([
    '$stateProvider',
    function($stateProvider) {
      $stateProvider
        .state('stateA', {
          controller: function () {
            // Do some magic related to state A
          }
        })
        .state('stateB', {
          controller: function () {
            // Do some magic related to state B
          }
        });
    }
  ])
  .controller(['$state', '$timeout', function($state, $timeout){
    // My global controller
    // To set a default state I could do:
    // $timout(function () {
    //   $state.go('stateA'); 
    // }, 0);
    // But that doesn't feel right to me.
  }]);

      

Update : Thanks to this answer, I figured out what I need to wrap $state.go

in $timeout

to avoid the error transition superseded

.

+3


source to share


1 answer


This will trigger a custom rule that goes to its default state without interfering with the URL.



$urlRouterProvider.otherwise(function($injector) {
    var $state = $injector.get('$state');
    $state.go('stateA');
});`

      

+5


source







All Articles