How to pass object with ui router between controllers in a $state angularjs

Question

I have my user module:

require('angular/angular');
require('angular-ui-router');


angular.module('userModule', ['ui.router'])
    .config(['$stateProvider', function($stateProvider) {


    $stateProvider
        .state('utenti', {
            url: '/utenti',
            templateUrl: 'src/utenti/views/utenti.tpl.html',
            controller: 'RegistrationCrl',    
        })

        .state('access', {
            url: '/access',
            templateUrl: 'src/utenti/views/access.tpl.html',
            controller: 'AccessCtrl',
        });


}])
.controller('RegistrationCrl', require('./controllers/registrationLogin'))
.controller('AccessCtrl', require('./controllers/access'));

In my RegistrationCrl I use a service to create a new member:

module.exports = function($scope, User, Member, $state, $location,$rootScope, $stateParams){
        $scope.registration = function(form){
            if(!form.$valid ){
                console.log('input error');
                return;
            }
            else{
                console.log('valid form');

                Member.create($scope.newMember,
                    function(data){
                        $state.go('access', data); 
                    },
                    function(data){
                        console.log(data);
                    }
                );

            }
        };
    };

I would like to use that data in my next view related to the accessCtl. I don't want to use the id in my URL and using the $stateParams.

My access controller is:

module.exports =  function($scope, User, Member, $state, $rootScope, $stateParams){
        console.log($state);
        console.log($stateParams);
    };

In that console.log I don't find my object passed with $state.go.

Can't you pass your data in $state as you pass the controller? .state('access', { url: '/access', templateUrl: 'src/utenti/views/access.tpl.html', controller: 'AccessCtrl', newData: 'whatever' }); It works with routes. — klauskpm
– klauskpm, Commented Jan 22, 2015 at 14:25
I have read about that but what i miss is how to put my data result from the registration in the newData property, what should i write in my registrationCrl? $state.go('access', {newData:data} ? — Gianfra
– Gianfra, Commented Jan 22, 2015 at 14:37
Oh, I've misunderstood you. I thought you were trying to pass a fixed value to your controller. So, I don't know. Sorry. — klauskpm
– klauskpm, Commented Jan 22, 2015 at 14:48

DannyGolhar · Accepted Answer · 2015-09-14 12:06:31Z

10

You can $stateParams to pass data to next view. Add param in target route

 $stateProvider
    .state('utenti', {
        url: '/utenti',
        templateUrl: 'src/utenti/views/utenti.tpl.html', 
        params: { myParam: null},
        controller: 'RegistrationCrl',    
    })

Pass data to next view

  $state.go("utenti",{myParam:{"data":"data"}})

And get data in next controller

         $scope.paramDetails=$stateParams.myParam;

edited Sep 14, 2015 at 12:06

answered Sep 14, 2015 at 11:55

DannyGolhar

2062 silver badges10 bronze badges

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

Comments

Community · Accepted Answer · 2017-05-23 12:25:54Z

0

It's my understanding that you can't pass objects between states as params. One option is to use a service which is accessible by all controllers that you inject it into.

There is a good answer already on SO for sharing a service Passing data between controllers in Angular JS?

edited May 23, 2017 at 12:25

CommunityBot

11 silver badge

answered Jan 22, 2015 at 14:58

tommyd456

10.8k28 gold badges97 silver badges165 bronze badges

2 Comments

Gianfra Over a year ago

I have read that answer but using a controller can be a bit messy. If i need to use this data in more views i have to add a function or a nee service every time. If i can't pass objects, can i pass some attributes of the objects?

tommyd456 Over a year ago

Pass some reference to the data and then search for it on your backend perhaps.

Billy · Accepted Answer · 2015-01-22 16:00:10Z

0

Use the resolve statement for ui.router

 resolve:{
      data: ['$stateParams', function($stateParams){
          return $stateParams.data;
      }]

answered Jan 22, 2015 at 16:00

Billy

1,1049 silver badges23 bronze badges

1 Comment

Gianfra Over a year ago

I use the resolve statement in my access state. But in my other controller (RegistrationCtr) how do i assign that data to my data? :) $state.go('access', data) ?

Karthikvenkat86 · Accepted Answer · 2015-09-20 18:25:40Z

0

You can set though the state param.

$state.get('details').Obj= {};
$state.go('details);

the access like below in the another controller which is attached to this state.

$state.get('details').Obj

answered Sep 20, 2015 at 18:25

Karthikvenkat86

848 bronze badges

Collectives™ on Stack Overflow

How to pass object with ui router between controllers in a $state angularjs

4 Answers 4

Comments

2 Comments

1 Comment

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

2 Comments

1 Comment

Comments

Linked

Related