如何在angularjs中将参数传递给$ http?

时间:2013-09-20 06:16:39

标签: http angularjs params

假设我有两个输入框,其对应的ng-model为fname和lname。如果我将http请求称为:

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

会调用网址:

/search?fname=fname&lname=lname

我在后端(python)得到的错误是:

cannot concatenate str and nontype objects.

这些参数不是作为字符串发送的吗?如果没有,如何解决这个问题?

4 个答案:

答案 0 :(得分:73)

以下是您的操作方法:

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

Angular takes care of encoding the parameters

Maxim Shoustin的回答不起作用({method:'GET', url:'/search', jsonData}不是一个有效的JavaScript文字)而JeyTheva的答案虽然简单,但是很危险,因为它允许XSS(不安全的值不会被转义你连接它们。)

答案 1 :(得分:15)

将URL '/search'构建为字符串。像

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

实际上我没有使用

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

但我确定“params”应该JSON.stringifyPOST类似

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

后:

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

答案 2 :(得分:2)

这是从routeprovider传递值的简单方法

//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){
            //....
        })

答案 3 :(得分:0)

我们可以使用输入数据将其作为HTML文件中的参数传递,使用ng-model绑定输入字段的值。

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

并在js文件中使用$ scope来访问此数据:

 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;
      });
    });

控制器功能将是这样的:

$watchers