web-dev-qa-db-fra.com

Angular: Passe les paramètres à $ http.get

J'essaie de transmettre un objet params au service $http.get(). Mes paramètres ressemblent à ceci:

var params = {
  one: value,
  two: value
}

Et j'essaie de les transmettre à ma fonction comme suit:

$http.get('/someUrl', params)
.success(function(data) {
   // stuff
})
.error(function(data) {
   // error stuff
});

Est-ce la bonne façon de s'y prendre?

javascriptangularjshttp
4
realph

Le deuxième argument de $http est un objet config (voir documentation). Parmi les autres propriétés, l'objet config accepte une propriété params:

  • params - {Object.<string|Object>} - Carte de chaînes ou d'objets qui seront sérialisés avec paramSerializer et ajoutés en tant que paramètres GET. 

Par conséquent, vous devez passer les paramètres en tant que tels

var config = {
    params: {
        one: value,
        two: value
    }
}

$http.get('/someUrl', config).then(...)

Supposons que les valeurs des paramètres soient respectivement '1' et '2', $http enverra une demande GET à l'URL suivante: 

/someUrl?one=1&two=2

En guise de remarque, essayez d'éviter d'utiliser les fonctions success et error sur $http. Ils sont obsolètes à partir d'angle 1.4.4. Utilisez les méthodes then avec un succès et un rappel d'erreur à la place, ou alors uniquement avec un rappel de succès et catch.

13
Michael P. Bazos

Service/Usine

Pour l’appel, utilisez une usine ou un service que vous pouvez injecter aux contrôleurs dont vous avez besoin. Voici un exemple de paramètres de transmission d’usine

.factory('Chats', function ($http, $rootScope, $stateParams) {
  return {
      all: function () {
          return $http.get('http://ip_address_or_url:3000/chats', { params: { user_id: $rootScope.session } })
      }
  };
});

Manette

Dans votre contrôleur, vous utilisez le service comme ceci

.controller('ChatsCtrl', function ($scope, Chats) {
    Chats.all().success(function (response) {
        $scope.chats = response;
    })
})
3
Joe Lloyd

J'ai fait face à un problème similaire ces derniers temps et j'ai dû ajouter quelques détails supplémentaires à demander (j'ai utilisé la réponse acceptée avec certains en-têtes):

$http.get(url, {
    params: {
        paramOne: valueOne,
        paramTwo: valueTwo,
        ...
    },
    headers: {
        'key': 'value'
    },
    // responseType was required in my case as I was basically
    // retrieving PDf document using this REST endpoint
    // This is not required in your case, 
    // keeping it for somebody else's reference
    responseType: 'arraybuffer'
}).success(
    function(data, status, headers, config) {
        // do some stuff here with data
    }).error(function(data) {
        // do some stuff here with data
});
2
Shrikant

$ Http documentation suggère que le deuxième argument de la méthode $ http.get est un objet que vous pouvez transmettre avec cet objet "param". 

Essayez quelque chose comme ça:

$http.get('/someUrl', {params: params})
.success(function(data) {
   // stuff
})
.error(function(data) {
   // error stuff
});
1
Shikloshi