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

Community
  • 1
  • 1
Sohail Faruqui
  • 442
  • 11
  • 27
  • 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](http://angular-ui.github.io/ui-router/site/#/api/ui.router.state.$stateProvider)). Please look at the documentation and delete the question. – hon2a Dec 16 '14 at 06:59
  • 1
    possible duplicate of [How to pass parameters using ui-sref in ui-router to controller](http://stackoverflow.com/questions/25647454/how-to-pass-parameters-using-ui-sref-in-ui-router-to-controller) – hon2a Dec 16 '14 at 07: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. – Sohail Faruqui Dec 16 '14 at 08:54

1 Answers1

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.

hon2a
  • 7,006
  • 5
  • 41
  • 55
  • Correct. The `params` option of our state config seems to be a giant leap... ;) – Radim Köhler Dec 16 '14 at 09:24
  • @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 – Sohail Faruqui Dec 16 '14 at 09:28
  • Error: Invalid params in state 'homezChild' – Sohail Faruqui Dec 16 '14 at 09:29
  • 1
    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.](http://stackoverflow.com/help/dont-ask)) If you are unable to complete it, either edit the question or create a new one. – hon2a Dec 16 '14 at 09:32
  • @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 :( – Sohail Faruqui Dec 16 '14 at 09:54
  • sorry the error is " Error: Invalid params in state 'home' " – Sohail Faruqui Dec 16 '14 at 10:05
  • I've added a fully functional demo to the answer. – hon2a Dec 16 '14 at 11:29