AngularJS: Get query string values without a hash in the link

Question

I am trying to get query string values using angularjs.

my Url: http://localhost/example.php?sportsId=3

when I applied var goto = $location.search()['sportsId']; it returns me undefined.

However, if I add hash in url like Url: http://localhost/example.php#?sportsId=3

then it returns me correct value 3.

But in this case, it also gives me Error: [$parse:syntax] http://errors.angularjs.org/1.3.8/$parse/syntax?p0=undefined&p1=not%20a%20primary%20expression&p2=null&p3=sportsID%3D&p4=sportsID%3D

Also, my default $_REQUEST['sportsId'] is not working with hash format.

How can I correctly get values from query string by using angularjs?

Answer 1

I know this is not Angular but its pure JS and works like a charm (just don't add dummyPath and it will take the URL).

function getUrlParameter(param, dummyPath) {
        var sPageURL = dummyPath || window.location.search.substring(1),
            sURLVariables = sPageURL.split(/[&||?]/),
            res;

        for (var i = 0; i < sURLVariables.length; i += 1) {
            var paramName = sURLVariables[i],
                sParameterName = (paramName || '').split('=');

            if (sParameterName[0] === param) {
                res = sParameterName[1];
            }
        }

        return res;
}

Usage:

var sportdsId = getUrlParameter('sportsId');

Answer 2

Three simple steps did the Job:

1. Config angular for HTML5 mode by adding the following code to your controller/service:

   app.config(['$locationProvider', function ($locationProvider) { $locationProvider.html5Mode(true); }]);

2. Add base element to your HTML:

<base href="/">

3. Inject "$location" into your angular controller:

   app.controller('ABCController', ['$scope', '$location', ABCController]);

Finally to get the query string use the following code:

var yourId = $location.search().yourId;

The answer is already there in previous answers, I just summarized for better understanding. Hopefully somebody will become beneficial from it.

Answer 3

Please refer below links

var goto = $location.search().sportsId;

Getting values from query string in an url using AngularJS $location

Answer 4

This is what I use. It's essentially the same as the accepted answer but returns all parameters as an object and handle decoding of url components.

function getUrlParameters() {
    var pairs = window.location.search.substring(1).split(/[&?]/);
    var res = {}, i, pair;
    for (i = 0; i < pairs.length; i++) {
        pair = pairs[i].split('=');
        if (pair[1])
            res[decodeURIComponent(pair[0])] = decodeURIComponent(pair[1]);
    }
    return res;
}