angularjs - Pass object as parameter in $state.go

Question

I want to navigate to another state/screen and pass a simple json object to this next screen.

I have the following:

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

My state looks like this:

.state('pages.claimed', {
  url: '/claimed',
  views: {
    'page': {
      templateUrl: 'templates/pages/claimed.html'
    }
  }
})

I can't however access the "benefit" object/parameter in the pages.claimed view. I'm using the ionic framework based on angular.

Answer 1

Parse object to json:

var benefit = angular.toJson({ "x": "y"});

Define variable in state params:

.state('pages.claimed', {
   url: '/claimed?params',
   views: {
     'page': {
       templateUrl: 'templates/pages/claimed.html'
     }
   }
})

Access to variable from controller via $stateParams:

var benefit = angular.fromJson($stateParams.benefit);

Here full doc

Edit:

There are several ways to pass an object to controller from url:

Via query params:

define options url: '/yoururl?a&b&c',

pass variables yoururl?a=1&b=2&c=3

Via url params:

define options url: '/yoururl/:a/:b/:c',

pass variables yoururl/1/2/3

For more complicated situations you can parse your object to json string and encode it with base64

Object: { a:1, b:2, c:3 } JSON String: {"a":1,"b":2,"c":3} Base64 Encoded string: eyJhIjoxLCJiIjoyLCJjIjozfQ==

define options url: '/yoururl?params'

pass variables yoururl?params=eyJhIjoxLCJiIjoyLCJjIjozfQ==

More info about base64