$stateParams is undefined in AngularJS

Question

In my project am using UI-router. Please check my below code to fix it

index.js

.state('survey.surveyList', {
        url: '/:id',
        templateUrl: 'survey/surveyList.html',
        controller: 'surveyController'
    });

surveyController.js

angular.module("adminsuite").controller("surveyController",['getAllSurveyService','$http','AuthenticationService', '$scope','$rootScope', '$state', '$stateParams', function(getAllSurveyService,$http, AuthenticationService,$scope,$rootScope,$state,$stateParams){
       $scope.getProjSurveys = function(projId){
        var i;
        for(i in $scope.allProjects){
         if(projId == $scope.allProjects[i].ProjectID){
          $scope.allSurveys = $scope.allProjects[i].Surveys;
         }
       }
         angular.element(document.querySelectorAll(".surveymodule")).removeClass('toggled');
      console.log($state.params.id);
  };
}]);

index.html

<li ng-repeat="obj in allProjects track by  $id(obj)">
                <a ui-sref="survey.surveyList({id: obj.ProjectID})" ng-click="getProjSurveys(obj.ProjectID)" data-id="{{obj.ProjectID}}">{{obj.ProjectName}}<span class="projectsetting"><img src="./images/settings.png"/></span></a>
            </li>

Above are my codes. when i try to access the id value using $stateParams it shows as undefined. Using this i am trying to call another function by passing $stateParams.id as parameter but it is not working. Please help

yes it is working fine. onclick i can go to this state but am unable to fetch this id value... — Kishan
– Kishan, Commented Sep 15, 2016 at 9:59
What's the output of $stateParams? I would assume you didn't set anything on the id, can you check the URL also — taguenizy
– taguenizy, Commented Sep 15, 2016 at 10:02

Rakesh Chand · Accepted Answer · 2016-09-15 10:22:30Z

2

Assuming you're passing id like following :-

$state.go('survey.surveyList', {id : id});

You can get the same id using

$state.params.id

Please tell me if you have anything different than this?

EDIT Prefer passing this way

<li ng-repeat="obj in allProjects track by  $id(obj)">
    <a ng-click="getProjSurveys(obj.ProjectID)" data-id="{{obj.ProjectID}}">{{obj.ProjectName}}<span class="projectsetting"><img src="./images/settings.png"/></span></a>
</li>

function getProjSurveys(ProjectID){
    $state.go('survey.surveyList', {id : ProjectID});
}

edited Sep 15, 2016 at 10:22

answered Sep 15, 2016 at 10:18

Rakesh Chand

3,1131 gold badge25 silver badges43 bronze badges

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

3 Comments

Kishan Over a year ago

Thanks i got the param id.

Kishan Over a year ago

In my above code i am calling getProjSurveys() on click of the projects which am getting from ng-repeat. I am facing problem like on refresh of the page it is loading the default page with id instead i want to load the same page the user clicked from the project list. How to do that using this params ?

Rakesh Chand Over a year ago

yes that;s right it'll load the new page with id because you're on a new state now. If you want to do it on same page then don't use new state instead do this id stuff in popup modal..

Collectives™ on Stack Overflow

$stateParams is undefined in AngularJS

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related