web-dev-qa-db-ja.com

アンギュラーjsの$ httpにパラメーターを渡す方法は？

Fnameとlnameとして対応するng-modelを持つ2つの入力ボックスがあると仮定します。 httpリクエストを次のように呼び出した場合：

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

urlを呼び出しますか：

/search?fname=fname&lname=lname

私がバックエンド（python）で得ているエラーは次のとおりです：

cannot concatenate str and nontype objects.

これらのパラメーターは文字列として送信されませんか？そうでない場合、これをどうやって回避するのですか？

httpangularjsparams
40
Sangram

方法は次のとおりです。

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

Angularはパラメータのエンコードを処理します 。

Maxim Shoustinの答えは機能せず（{method:'GET', url:'/search', jsonData}は有効なJavaScriptリテラルではありません）、JeyThevaの答えは単純ですが、XSSを許可するため危険です（安全でない値は連結してもエスケープされません）。

73
sleblanc

URL '/search'を文字列として作成します。好む

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

実際に私は使用しませんでした

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

しかし、「params」はPOSTのようにJSON.stringifyでなければなりません

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

後：

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

ルートプロバイダーから値を渡す簡単な方法を次に示します

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

入力データを使用して、HTMLファイルのパラメーターとして渡すことができます。ng-modelを使用して、入力フィールドの値をバインドします。

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

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

また、jsファイルでは、$ scopeを使用してこのデータにアクセスします。

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

コントローラー機能は次のようになります。

 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;
      });
    });
0
Abdallah Okasha