I am currently utilizing ui-router to transfer an object to another state and controller by using
$state.go()
However, when I check the console.log for the $stateParams object, it appears as undefined. The object consists of x and y coordinates which are integers ranging from 0 to 20. When I log the userData in the EnterCtrl
, the variables display correctly, leading me to believe that the correct data is being sent.
Despite exploring various examples and attempting different approaches, I have been unable to make it function properly. How can I ensure that the $stateParams
is accessible by the CanvasCtrl
?
The EnterCtrl
sends the userData object via $state.go
myMap.controller('EnterCtrl',['$scope', '$state', function EnterCtrl($scope,$state){
$scope.formData = {
x: 0,
y: 0
};
var userData = $scope.formData;
// console.log(userData);
$scope.goToAnswer = function(){
console.log(userData);
$state.go('answer', {coor: userData}) ;
};
}]);
The Answer State where the object is passed to.
var answerState = {
name: 'answer',
url: '/answer/:coor',
templateUrl: 'partials/answer.html',
controller: 'CanvasCtrl',
params: {coor: null}
};
The controller which receives the stateParams.
myMap.controller('CanvasCtrl', ['$scope','$state','$stateParams',function CanvasCtrl($scope,$state,$stateParams){
var userData = $stateParams.coor;
// var userDataY = $stateParams.coor.y;
//var userDataX = $stateParams.coor.y;
console.log(userData);
}]);