How do I set $stateParams by using url parameters using uiRouter in Plunker?

Question

I'm trying to demonstrate something using url-query parameters using plunker, but I can't even get the parameters to show up (and then consequently not demonstrate my original issue).

I have created a simple plunker where the states url property looks like this: url: '/root?firstParam' What I want then is to populate $stateParams.firstParam with whatever I write in the url of the browser for that queryParameter. Plunker, plunkerWithParameter?firstParam=foo

I would imagine that $stateParams.firstParam would be undefined for the first url, but set to "foo" for the second. But it's undefined in both cases.

How can I get the $stateParams.firstParam to be set?

Answer 1

Edit: It seems that it is actually possible (@Rogerio Soares answer proves this). Keeping my answer here because there was an other error in the code.

There is no way to get the parameters from the browsers search bar in a Plnkr app since it is running in an iFrame. I fixed another problem of yours below:

I added the parameter to your otherwise statement like this:

$urlRouterProvider.otherwise('/root?firstParam=test');

The problem is that you redirected to root when no other route was found, and you didn't specify any parameters to the route.

Updated PlunkR: https://plnkr.co/edit/OxEGVkhzBO332ym3q8fV?p=preview