Pass object as parameter in $state.go

I’m trying to navigate to a second screen/view by using $state.go. That’s easy enough, but when trying to pass an object to the next state, I’m in trouble:

My state looks like this:

.state('pages.claimed', {
    url: '/claimed',
    params: ["benefit"],
    views: {
      'page': {
        templateUrl: 'templates/pages/claimed.html'
      }
    }
  })

this will complain saying I can’t have URL and params at the same time:

ncaught Error: [$injector:modulerr] Failed to instantiate module stempeltjeBusiness due to:
Error: Both params and url specicified in state 'pages.claimed'

I tried to remove the url from the state to navigate like this:

var benefit = { "x": "y"};
$state.go('pages.claimed', { 'benefit': benefit });

This will crash with the following error:

Uncaught TypeError: Cannot read property 'insertBefore' of null 

Does anyone have an idea how this can be solved? Thanks for helping out!

  1. if you use url attribute you should add your params to the url described here:
    URL Routing · angular-ui/ui-router Wiki · GitHub
  1. Maybe you should pass your benefits as an array not an object?

    $state.go(‘pages.claimed’, { ‘benefit’: [‘x’, ‘y’] });

Thanks for the links. I solved it by passing the object in the URL, not as clean as I hoped but it works!

You could do it clean:

build an abstract state with the baseurl and another one for the parameters.
The abstract state holds the url and the other one the parameters ;).

Greetz

1 Like

I was hoping to do something similar without passing a whole bunch of parameters in URLs, specifically I have a ng-click handler that tries to do this:

$scope.goToProfile = function(friend) {
    $state.go('app.profile', { id: friend.id, name: friend.name });
}

My state:

.state('app.profile', {
        views : {
            'menuContent' : {
                templateUrl : "templates/profile.html",
                controller : 'ProfileCtrl'
            }
        },
        params: ['id','name']
    })

The docs on this are a bit incomplete and confusing. I see an error and the click transitions me to a different state completely.

Essentially, Im moving state from app.connect.friends to app.profile (i.e. a completely separate state above the hierarchy Im currently in -$state.go() doesn’t seem to like that).