AngularJS - route with parameter to be accesses globally

Question

I am creating a survey form in AngularJS. The requirement is this that the survey link with surveyId in parameter will be provided in email.

I tired the following code, but I can't access the surveyId in the receiving controller, it shows undefined. Moreover when I try to access the url with parameter directly, it does not load.

This is how I am trying to access the link directly in my local environment, where 4 is the surveyId http://localhost:9000/fillSurvey/4

Can someone please guide me in the right direction?`

var app = angular.module('mainApp', ['ngRoute']);

app.config(['$routeProvider', '$locationProvider',


  function($routeProvider, $locationProvider) {

    /*$locationProvider.html5Mode(true).hashPrefix('!');*/

    $locationProvider.html5Mode({
      enabled: true,
      requireBase: false
    });
    $routeProvider.when('/fillSurvey/:surveyId', {
        templateUrl: 'surveyManagement/views/surveysList.html',
        controller: 'fillSurveyCtrl'
      })

      .otherwise({
        redirectTo: '/'
      })

  }
]);


app.controller('fillSurveyCtrl', ['$scope', '$location', '$http', '$localStorage', '$filter', '$interval', function($scope, $location, $http, $localStorage, $filter, $interval, $routeParams) {


  $scope.surveyId = $routeParams.surveyId;
  alert($scope.surveyId);

}]);

EDIT

So I was missing to add dependency '$routeParams' that is why got undefined. Can someone please guide me how to make the link accessible from anywhere like this baseURL/fillSurvey/5

where 5 is the survey id

Thanks

Answer 1

Your controller is not configured properly.

Compare ['$scope', '$location', '$http', '$localStorage', '$filter', '$interval',

---

function($scope, $location, $http, $localStorage, $filter, $interval, $routeParams )

I hope you figured it out.