web-dev-qa-db-fra.com

AngularJS: Obtient des valeurs de chaîne de requête sans hachage dans le lien

J'essaie d'obtenir des valeurs de chaîne de requête en utilisant angularjs. 

mon URL: http://localhost/example.php?sportsId=3

quand j'ai appliqué var goto = $location.search()['sportsId'];it, il me renvoie undefined.

Cependant, si j'ajoute un hachage dans l'URL comme Url: http://localhost/example.php#?sportsId=3

alors il me renvoie la valeur correcte 3.

Mais dans ce cas, cela me donne aussi 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

De plus, mon $_REQUEST['sportsId'] par défaut ne fonctionne pas avec le format de hachage.

Comment puis-je obtenir correctement les valeurs d'une chaîne de requête en utilisant angularjs?

javascriptphpangularjs
13
Farjad Hasan

Je sais que ce n’est pas angulaire, mais son JS pur et fonctionne comme un charme (n’ajoutez pas dummyPath et il prendra l’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');
27
prototype

S'il vous plaît se référer ci-dessous des liens

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

Obtention des valeurs d'une chaîne de requête dans une URL à l'aide de l'emplacement AngularJS $

2
Arepalli Praveenkumar

Le Job a fait trois étapes simples:

  1. Configurez angular pour le mode HTML5 en ajoutant le code suivant à votre contrôleur/service:

    app.config (['$ emplacementProvider', fonction ($ emplacementProvider) { $ emplacementProvider.html5Mode (true); }]);

  2. Ajoutez un élément de base à votre code HTML:

<base href="/">

  1. Injectez "$ location" dans votre contrôleur angulaire:

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

Enfin, pour obtenir la chaîne de requête, utilisez le code suivant:

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

La réponse est déjà présente dans les réponses précédentes, je viens de résumer pour une meilleure compréhension. J'espère que quelqu'un en tirera profit. 

1
Dash

C'est ce que j'utilise. C'est essentiellement la même chose que la réponse acceptée, mais elle renvoie tous les paramètres sous forme d'objet et gère le décodage des composants de l'URL.

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;
}
1
gamliela

Vous devez utiliser

$location.search()

Cela retourne un objet avec vos paramètres, alors disons que vous avez.

Cela donnera le retour suivant

{ param1 : val, param2 : val2 }

Assurez-vous également d'activer 

$locationProvider.html5Mode(true);
1
Chris Noring

Créez vous-même un objet de recherche à partir de la propriété $window.location.search en utilisant les éléments suivants:

    var search = $window.location.search
            .split(/[&||?]/)
            .filter(function (x) { return x.indexOf("=") > -1; })
            .map(function (x) { return x.split(/=/); })
            .map(function (x) {
                x[1] = x[1].replace(/\+/g, " ");
                return x;
            })
            .reduce(function (acc, current) {
                acc[current[0]] = current[1];
                return acc;
            }, {});

    var sportsId = search.sportsId;

ou créez une fabrique queryString que vous pouvez utiliser n’importe où .. Cela combine les parties gauche et droite de la chaîne de requête .. avant le # et après le #

(function () {
    "use strict";

    angular
        .module("myModuleName")
        .factory("queryString", QueryStringFactory);

    function QueryStringFactory($window, $location) {

        function search() {

            var left = $window.location.search
                .split(/[&||?]/)
                .filter(function (x) { return x.indexOf("=") > -1; })
                .map(function (x) { return x.split(/=/); })
                .map(function (x) {
                    x[1] = x[1].replace(/\+/g, " ");
                    return x;
                })
                .reduce(function (acc, current) {
                    acc[current[0]] = current[1];
                    return acc;
                }, {});

            var right = $location.search() || {};

            var leftAndRight = Object.keys(right)
                .reduce(function(acc, current) {
                    acc[current] = right[current];
                    return acc;
                }, left);

            return leftAndRight;
        }

        return {
            search: search
        };

    }

}());

usage:

var qs = queryString.search();
var sportsId = sq.sportsId;
1
CraftyFella