ui-router default stateParam

Question

I have a state defined as such:

.state('dashboard.poor-calls', {
    url: '/voice-quality/{callType}/{categoryTypeId}/{:categoryEntityId}/?{:tableView}',
    template: '<poor-calls></poor-calls>',
    reloadOnSearch: false
})

Notice that categoryEntityId is optional.

Is there a way to specify a default value for categoryEntityId if it's not provided in the state() definition, or does the controller of my <poor-calls> directive have to check for a missing categoryEntityId and assume the default value?

score 4 · Accepted Answer · edited May 23 '17 at 12:03

Yes, we can use params : {} configuration property:

.state('dashboard.poor-calls', {
    url: '/voice-quality/{callType}/{categoryTypeId}/{:categoryEntityId}/?{:tableView}',
    params: {categoryEntityId: 1}
    template: '<poor-calls></poor-calls>',
    reloadOnSearch: false
})

and we can even set what to do if that default value is provided, for example skip it from url (the squash setting):

params: { 
   categoryEntityId: {
      value: 1,
      squash: false,
   },
},

See all the details here:

ui-router default stateParam

1 Answers1

Angular ui router passing data between states without URL

How to pass parameters using ui-sref in ui-router to controller