httpparams - import http from ''@ angular http

¿Cómo pasar parámetros a $ http en angularjs?

Question

Supongamos que tengo dos cuadros de entrada con el modelo ng correspondiente como fname y lname. Si llamo a http request como:

$http({method:''GET'', url:''/search'', params:{fname: fname, lname: lname}})

¿Llamará a la url?

/search?fname=fname&lname=lname

El error que estoy obteniendo en el backend (python) es:

cannot concatenate str and nontype objects.

¿Estos parámetros no se envían como cadenas? Si no, ¿cómo moverse con esto?

Answer 1

Aquí hay un paso simple para pasar valores de un proveedor de ruta

//Route Provider
$routeProvider.when("/page/:val1/:val2/:val3",{controller:pageCTRL, templateUrl: ''pages.html''});
//Controller
$http.get( ''page.php?val1=''+$routeParams.val1 +''&val2=''+$routeParams.val2 +''&val3=''+$routeParams.val3 , { cache: true})
.then(function(res){
//....
})

Answer 2

Así es como lo haces:

$http.get("/url/to/resource/", {params:{"param1": val1, "param2": val2}})
.then(function (response) { /* */ })...

Angular se encarga de codificar los parámetros .

La respuesta de Maxim Shoustin no funciona ( {method:''GET'', url:''/search'', jsonData} no es un literal válido de JavaScript) y la respuesta de JeyTheva, aunque simple, es peligrosa ya que permite XSS (no se escapan los valores inseguros los concatena)

Answer 3

Construye URL ''/search'' como cadena. Me gusta

"/search?fname="+fname"+"&lname="+lname

En realidad no usé

 `$http({method:''GET'', url:''/search'', params:{fname: fname, lname: lname}})`

pero estoy seguro de que "params" debería ser JSON.stringify como para POST

var jsonData = JSON.stringify(
{
fname: fname,
lname: lname
}
);

Después:

$http({
method:''GET'',
url:''/search'',
params: jsonData
});

Answer 4

Podemos usar datos de entrada para pasarlo como un parámetro en el archivo HTML w use ng-model para vincular el valor del campo de entrada.

<input type="text" placeholder="Enter your Email" ng-model="email" required>
<input type="text" placeholder="Enter your password " ng-model="password" required>

y en el archivo js use $ scope para acceder a esta información:

$scope.email="";
$scope.password="";

La función del controlador será algo así:

 var app = angular.module(''myApp'', []);
app.controller(''assignController'', function($scope, $http) {
$scope.email="";
$scope.password="";
$http({
method: "POST",
url: "http://localhost:3000/users/sign_in",
params: {email: $scope.email, password: $scope.password}
}).then(function mySuccess(response) {
// a string, or an object, carrying the response from the server.
$scope.myRes = response.data;
$scope.statuscode = response.status;
}, function myError(response) {
$scope.myRes = response.statusText;
});
});