web-dev-qa-db-fra.com

Construire une chaîne de requête à partir de l'objet parameters

Comment construire une URL avec des paramètres de requête dans Angularjs.

Je vois l'API $ location.search ()

le problème est $ location (url) est de rediriger vers l'URL. Dans mon cas, je veux passer une paire URL/clé: valeur pour les paramètres de requête et construire l’URL. quelque chose comme

url: /a/b/c paramètres: {field1: value1, field2: value2}

résultat: /a/b/c?field1=value1&field2=value2

J'aime utiliser cette URL pour les liens. J'ai aussi vu angular encoder ?, & personnages. Puis-je éviter cela?

Modifier:

Mon intention était d'utiliser l'URL comme href pour les éléments d'ancrage. J'utilise la requête $ http pour envoyer la requête, mais je dois parfois fournir un lien avec des paramètres de requête (basés sur l'objet actuel)

Merci

javascriptangularjsquerystringparameter
75
bsr

Il existe une solution intéressante à partir de 1.4+. Vous pouvez créer une chaîne de requête à partir d'un objet parameters avec $httpParamSerializer:

var qs = $httpParamSerializer(params);

Voir la documentation ici

Sérialiseur $ http params par défaut qui convertit les objets en chaînes selon les règles suivantes:

{'foo': 'bar'} results in foo=bar
{'foo': Date.now()} results in foo=2015-04-01T09%3A50%3A49.262Z (toISOString() and encoded representation of a Date object)
{'foo': ['bar', 'baz']} results in foo=bar&foo=baz (repeated key for each array element)
{'foo': {'bar':'baz'}} results in foo=%7B%22bar%22%3A%22baz%22%7D" (stringified and encoded representation of an object)
Note that serializer will sort the request parameters alphabetically.
123
Armel Larcier

Angular utilise la fonction buildUrl() en interne pour créer une chaîne de requête à partir d'un objet de paramètres. Pour le moment, il est impossible de l’utiliser dans votre code car il est privé de $HttpProvider À moins que vous ne vouliez faire de la magie eval().

Problèmes liés à github:

14
shock_one

Croyez que vous êtes vraiment en train d'aboyer le mauvais arbre ... vous devez jeter un coup d'œil au service $ http qui vous donne $ http.get (url, config) ou $ http.post (url, données, config). Pour une demande GET avec des paramètres, voir le SO suivant

$ http get paramètres ne fonctionne pas

Pour plus d'informations sur $ http et son fonctionnement, reportez-vous à la documentation Angular.

http://docs.angularjs.org/api/ng.$http

Je ne comprends peut-être pas le but et vous voulez réellement naviguer vers un endroit différent. Ce que je suggère ici, c'est simplement de faire la demande en arrière-plan (style AJAX).

http://jsfiddle.net/4ZcUW/

Le JS

angular.module("myApp", []).controller("MyCtrl", ["$scope", "$window", function($scope, $window) {
    $scope.goPlaces = function(url, parameter) {
        $window.open("http://www."+url+"?q="+parameter);
        //$window.open("http://www."+url+"?q="+parameter, "_self");
        //$window.open("http://www."+url+"?q="+parameter, "_top");
    };
}])

Le HTML

<div ng-app="myApp" ng-controller="MyCtrl">
    <a href="#" ng-click="goPlaces('google.com','Shaun Husain')">Find me</a>
</div>

Est-ce que cela fonctionne pour votre cas?

3
shaunhusain

les règles de formatage des URL internes et externes d'angular sont légèrement différentes.

L'emplacement $ est un moyen d'activer les routes internes au sein de votre propre application.

Si c'est un lien externe, alors $ http est ce que vous voulez.

S'il s'agit d'un lien interne, vérifiez qu'il vaut peut-être la peine de vérifier la syntaxe hash/bang.

0
Chris Reynolds