$stateParams for a state with only queryParameters in its url

Viewed 120

I have states that look like this:

$stateProvider.state('base', {
  url: '/base',
  redirectTo: 'base.all',
  template: '<div ui-view></div>'
})
.state('base.all', {
  parent: 'base',
  url: '?someQuery&another',
  params: {
    someQuery: null,
    another: null
  },
  views: {
    '': {
       template: '<div>base.all</div>',
       controller: function($stateParams){
         console.log($stateParams.someQuery);//undefined
         console.log($stateParams.another);//undefined
       }
     }
    //some views
  }
})
.state('base.all2', {
  parent: 'base',
  url: '/subPath?someQuery&another',
  params: {
    someQuery: null,
    another: null
  },
  views: {
    '': {
       template: '<div>base.all2</div>',
       controller: function($stateParams){
         console.log($stateParams.someQuery);//foo
         console.log($stateParams.another);//bar
       }
     }
    //some views
  }
});

I listen to the event $stateChangeStart and do $state.go when redirectTo is present.

My problem now is if I go to the url /base?someQuery=foo&another=bar

It will correctly go to the base.all-state but the $stateParams of the base.all-state will be empty. I don't want this state to have a subPath. The child state will only get the urlParameters set to $stateParams if it has its own subPath like /base/subPath?someQuery=foo&another=bar then it works fine and everything is set to $stateParams.

Is my attempt to have a subState with no subUrl, but only the queryParameters, possible? If so how?

1 Answers
Related