CODEWITHSUNDEEP
angularjsangular-ui-routerparameters
Shailesh Vaishampayan
Shailesh Vaishampayan

Reputation: 1796

Difference between AngularJS UI Router params object specified in state and views

I have just started working on AngularJS and specifically Angular UI Router project. While working on a project I observed that some of team members have specified params option object in view option object of state. when this is the case it doesn't accept optional parameters when passed through ui-sref/state.go. However I moved this params option object to state instead of view and optional parameters feature started working. I am using AngularJS 1.3.x and AngularJS UI Router version 0.2.13. Here is the sample code to explain more clearly what I want to say : 

   $stateProvider.state('contacts', {
     url:"/user/{userId}/contact"
     views: {
        'view1': { 
            ....//other options
            params :{userId:0,contactId:null}
         }
     }
     ...//other options including `controller` and `resolve` options.          
   });

In above sample code(I have given minimal required information) params object is specified on view1 object instead of on contacts state. Also contactId is the optional non-URL parameter which is passed on one of the use case and not passed in another one. However when I check $stateParams object in the controller specified on state it just shows up userId and not contactId even if I pass it.
I fixed this issue when I moved params option object from view1 object to contacts state object as shown below:

    $stateProvider.state('contacts', {
     url:"/user/{userId}/contact"
     views: {
        'view1': { 
            ....//other options
            //i have removed the `params` object from here..
         }
     }
     ...//other options including `controller` and `resolve` options.          
     params :{userId:0,contactId:null} //and have put it here.
   });

Now I have following questions :
1) What difference does it make by changing where I specify params object. What are the significance if any?
2)Is specifying params object on view altogether wrong configuration? If yes then why UI router doesn't complain and works with parameters specified in URL? If no then why it doesn't work with optional non-URL parameters?
3) Any specific use cases one would prefer specifying params option object on view object than on state object?

Also another side effect I found when I moved this params option object to state from view object is I am no longer able to bookmark this url or even refresh url in browser. When I do this it redirects me to our home page. Maybe this could be how we are handling this redirection in our project. But just curious to have any pointers why this could be happening?(including how generally this redirection is handled using ui-router) Of course I am going dig deep into our project code to see why this side-effect is happening.
However I would at least like to have answers to my 3 questions(and subquestions) I have asked here.

Upvotes: 0

Views: 337

Answers (1)

JB Nizet
JB Nizet

Reputation: 692151

Neither the guide nor the API documentation say that a named view can have parameters. So I think adding params in the view was just a mistake, and it had no effect whatsoever.

So,

1) What difference does it make by changing where I specify params object. What are the significance if any?

In the views, ui-router doesn't care about it. In the state, it does what is documented in the API documentation.

2) Is specifying params object on view altogether wrong configuration? If yes then why UI router doesn't complain and works with parameters specified in URL? If no then why it doesn't work with optional non-URL parameters?

Yes, it seems to be wrong configuration.

3) Any specific use cases one would prefer specifying params option object on view object than on state object?

No

Upvotes: 1

Related Questions