Reputation: 2193
I've defined a params object on my parent state and want to assign values to the properties, on child states, and have that value persist to other states. When I navigate to child states I see the $stateParams.property but after assigning a value to $stateParams.property the value is not persisting to the next sibling state.
.state({
name: 'parent',
url: '/parent',
templateUrl: 'app/parent.html',
controller: 'parentController',
controllerAs: 'vm',
resolve: {
user: function(){
return { user: {} };
},
//regionsCountriesInfo: ['$stateParams', function($stateParams){
// return $stateParams.regionsCountriesInfo;
//}],
// edit
regionsCountriesInfo: function(){
return { value: [] };
}
},
children: [
{
name: 'region',
url: '/region',
templateUrl: 'app/region.html',
controller: 'regionController',
controllerAs: 'vm',
ncyBreadcrumb: {
label: 'Regions',
parent: 'parent'
},
resolve: {
user: function(user) {
return user;
},
// edit
regionsCountriesInfo: function(regionsCountriesInfo) {
return regionsCountriesInfo;
}
}
},
{
name: 'user',
url: '/user',
templateUrl: 'app/user.html',
controller: 'userController',
controllerAs: 'vm',
ncyBreadcrumb: {
label: 'Users',
parent: 'parent'
},
resolve: {
user: function(user) {
return user;
},
// edit
regionsCountriesInfo: function(regionsCountriesInfo) {
return regionsCountriesInfo;
}
}
},
// regionController
regionController.$inject = [
'$scope',
'$translate',
'$uibModal',
'$state',
'$stateParams',
'$rootScope',
'regionsCountriesInfo'
];
function regionController($scope, $translate, $uibModal, $state, $stateParams, $rootScope, regionsCountriesInfo) {
...
vm.selectedRegions = [];
...
vm.selectedRegions.push(region)
console.log('regionController regionsCountriesInfo');
console.log(regionsCountriesInfo);
regionsCountriesInfo = vm.selectedRegions;
console.log('regionController regionsCountriesInfo');
console.log(regionsCountriesInfo);
// regionController console output
regionController regionsCountriesInfo
undefined
regionController regionsCountriesInfo
[Object]
// userController
userController.$inject = [
'$translate',
'$uibModal',
'$state',
'$scope',
'$timeout',
'$stateParams',
'$rootScope',
'regionsCountriesInfo'
];
function userController($translate, $uibModal, $state, $scope, $timeout, $stateParams, $rootScope, regionsCountriesInfo) {
...
console.log('userController regionsCountriesInfo');
console.log(regionsCountriesInfo);
// userController console output
userController regionsCountriesInfo
undefined
Why is $stateParams.regionsCountriesInfo empty in the user state when I assigned a value to it in the region sibling state?
Upvotes: 1
Views: 481
Reputation: 2193
I guess the problem was that I needed to use a regular resolve object, as the value I needed to persist wasn't in $stateParams to begin with i.e., it was defined in the regionController. See edit above.
Upvotes: 0
Reputation: 1053
i think each child create isolated varibles , did you try to repass it to child in routing ?
Upvotes: 0
Reputation: 1098
You need to use resolve in the parent state as $stateparams only contains params registered with that state.
state({
name: 'parent',
url: '/parent',
templateUrl: 'app/parent.html',
controller: 'parentController',
controllerAs: 'vm',
resolve: {
regionsCountriesInfo: ['$stateParams', function($stateParams){
return $stateParams.regionsCountriesInfo;
}]
}
Upvotes: 1