4

This question is might be similar to this but with different requirements. As I was not able to make comment (required 50 points) I am replicating the question.

I want to simply access the parameters sent from ui-sref in template inside the controller without mentioning them in state URL .

Something like using the link below for transitioning the state to home with foo and bar parameters:

<a ui-sref="home({foo: 'fooVal', bar: 'barVal'})">Go to home state with foo and bar parameters </a>

Receiving foo and bar values in a controller:

state('home', { url: '/:foo', views: { '***whatIsThis***': { templateUrl: 'home.html', controller: 'MainRootCtrl' }, app.controller('SomeController', function($scope, $stateParam) { //.. var foo = $stateParam.foo; //getting fooVal var bar = $stateParam.bar; //getting barVal //.. });

I get undefined for $stateParam in the controller.

Could somebody help me understand how to get it done? I want to get bar as well without adding it to URL

Improve this question
3
  • 2
    The name of the service is $stateParams (not $stateParam). If you want to define additional params that won't appear in the URL, use the params config (see documentation). Please look at the documentation and delete the question. Commented Dec 16, 2014 at 6:59
  • 1
    possible duplicate of How to pass parameters using ui-sref in ui-router to controller Commented Dec 16, 2014 at 7:01
  • @hon2a: thanks man, but I am getting error "Invalid params in state" while using them. can you provide a sample(google it but couldnt find,sorry I am new to AngularJs so might be searched with wrong keyword or...) I am trying to send to param from sref as shown in question and try to capture the one which is not mentioned in URL using params property and throw the mentioned error. Commented Dec 16, 2014 at 8:54

1 Answer 1

Reset to default
2

If some of your params are not supposed to show up in the URL, you need to combine url and params:

.state('home', { url: '/:foo', params: { foo: 'default value of foo', bar: 'default value of bar' }, ... })

and then use $stateParams properly:

.controller('SomeController', ['$scope', '$stateParams', function ($scope, $stateParams) { // ... (use $stateParams) }])

(see documentation).

And, if you're still stuck, please take a look at this working codepen demo.

Improve this answer
Sign up to request clarification or add additional context in comments.

7 Comments

Correct. The params option of our state config seems to be a giant leap... ;)
@hon2a: hey mate propitiate for the time you are spending to provide answers, but let me explain a bit more about my requirement, as I mentioned in my question I want to send 2 parameters in ui-sref and out of these 2 one will be shown in url and other will be use in my controller, as per my understanding when we use params: {} the values provided inside its body will be replaced the state param if they are not retrieved so i do not want them to be initialize with some value BUT if we are mentioning them for the sake of injecting them into $stateParams then i am getting following error
Error: Invalid params in state 'homezChild'
My answer shows how to have a state with 2 params, only one of which is shown in the URL. Please study the answer and the linked documentation and try to create a solution. (This is not a "debug my code for me" site.) If you are unable to complete it, either edit the question or create a new one.
@hon2a: thanks mate, I am not asking to debug my program ;), i was just trying to say there might be some issue with "params" property of state..I am just trying to use it in a 2 page application before using it in my real application and getting that error...what I am doing passing to param from ui-sref and rest is your state configuration which is also there in documentation that you provided, but its simply not even navigating :(
|

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.