如何用多个参数在angularjs中发送POST?

我想用angularjs HTTP post服务发送多个参数。

这里是客户端代码:

$http.post("http://localhost:53263/api/Products/", [$scope.product, $scope.product2]). then(function (data, status, headers, config) { alert("success") }, function (data, status, headers, config) { alert("error") }); 

这里是服务器端代码:

 // POST api/<controller> public void Post([FromBody]Product product,[FromBody]Product product2) { var productRepository = new ProductRepository(); var newProduct = productRepository.Save(product); } 

但是,当我发布post时,我得到错误。 任何想法我做错了什么?

  var Indata = {param:'val1',.....} $http({ url: "time.php", method: "POST", params: Indata }) 

客户端

数据需要在对象数组中作为有效载荷分组 – Indata

 var Indata = {'product': $scope.product, 'product2': $scope.product2 }; 

作为第二个参数,通过$http.post传递有效载荷:

 $http.post("http://localhost:53263/api/Products/", Indata).then(function (data, status, headers, config) { alert("success"); },function (data, status, headers, config) { alert("error"); }); 

服务器端

创build一个数据传输对象(DTO)类,如下所示:

 public class ExampleRequest { public string product {get; set;}; public string product2 {get; set;}; } 

下面的类接受DTO具有与有效载荷相同的属性名称。

 public void Post(ExampleRequest request) { var productRepository = new ProductRepository(); var newProduct = productRepository.Save(request.product); } 

在上面的类中, request包含2个属性,其中包含productproduct2

这取决于你的后端技术。 如果您的后端技术接受JSON数据。 数据:{ID:1,名称: '姓名',…}

否则,你需要转换你的数据最好的方式来做到这一点创build工厂转换您的数据为id = 1&name = name&…

然后在$ http上定义content-type。 你可以find完整的文章@ https://www.bennadel.com/blog/2615-posting-form-data-with-http-in-angularjs.htm

 $http({ method: 'POST', url: url, headers: {'Content-Type': 'application/x-www-form-urlencoded'}, transformRequest: function(obj) { var str = []; for(var p in obj) str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p])); return str.join("&"); }, data: {username: $scope.userName, password: $scope.password} }).success(function () {}); 

ref: 如何在AngularJS中用$ http POST urlencoded表单数据?

关于encodeURIComponent(obj [p])的重要将以隐含的方式传递对象。 像一个date值将被转换为一个string,如=>'Fri Feb 03 2017 09:56:57 GMT-0700(美国山区标准时间)',我不知道如何parsing它至less在后面 – 结束C#代码。 (我的意思是不需要超过2行的代码),您可以在date情况下使用(angular.isDate,value.toJSON)将其转换为您的后端代码更有意义的格式。

我正在使用这个functioncomunicating我的后端web服务…

  this.SendUpdateRequest = (url, data) => { return $http({ method: 'POST', url: url, headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, transformRequest: function (obj) { return jsontoqs(obj); }, data: { jsonstring: JSON.stringify(data) } }); }; 

和波纹pipe代码来使用它…

 webrequest.SendUpdateRequest( '/Services/ServeicNameWebService.asmx/Update', $scope.updatedto) .then( (res) => { /*/TODO/*/ }, (err) => { /*/TODO/*/ } ); 

在后端C#我使用牛顿软件反序列化的数据。

你只能通过post发送1个对象作为参数。 我会改变你的Post方法

 public void Post(ICollection<Product> products) { } 

并在您的angular码中,您将传递一个JSON符号的产品数组

这是直接的解决scheme:

 // POST api/<controller> [HttpPost, Route("postproducts/{product1}/{product2}")] public void PostProducts([FromUri]Product product, Product product2) { Product productOne = product; Product productTwo = product2; } $scope.url = 'http://localhost:53263/api/Products/' + $scope.product + '/' + $scope.product2 $http.post($scope.url) .success(function(response) { alert("success") }) .error(function() { alert("fail") }); }; 

如果你是理智的,你可以这样做:

 var $scope.products.product1 = product1; var $scope.products.product2 = product2; 

然后发送产品在身体(如balla)。

您也可以在{}内发送( POST )多个参数并添加它。

例:

 $http.post(config.url+'/api/assign-badge/', {employeeId:emp_ID,bType:selectedCat,badge:selectedBadge}) .then(function(response) { NotificationService.displayNotification('Info', 'Successfully Assigned!', true); }, function(response) { }); 

employeeIdbType (徽章类别)和badge是三个参数。

 var name = $scope.username; var pwd = $scope.password; var req = { method: 'POST', url: '../Account/LoginAccount', headers: { 'Content-Type': undefined }, params: { username: name, password: pwd } } $http(req).then(function (responce) { // success function }, function (responce) { // Failure Function }); 

如果你正在使用ASP.NET MVC和Web API机会,你已经安装了Newtonsoft.Json NuGet包。这个库有一个名为JObject的类,它允许你传递多个参数:

Api控制器:

 public class ProductController : ApiController { [HttpPost] public void Post(Newtonsoft.Json.Linq.JObject data) { System.Diagnostics.Debugger.Break(); Product product = data["product"].ToObject<Product>(); Product product2 = data["product2"].ToObject<Product>(); int someRandomNumber = data["randomNumber"].ToObject<int>(); string productName = product.ProductName; string product2Name = product2.ProductName; } } public class Product { public int ProductID { get; set; } public string ProductName { get; set; } } 

视图:

 <script src="~/Scripts/angular.js"></script> <script type="text/javascript"> var myApp = angular.module("app", []); myApp.controller('controller', function ($scope, $http) { $scope.AddProducts = function () { var product = { ProductID: 0, ProductName: "Orange", } var product2 = { ProductID: 1, ProductName: "Mango", } var data = { product: product, product2: product2, randomNumber:12345 }; $http.post("/api/Product", data). success(function (data, status, headers, config) { }). error(function (data, status, headers, config) { alert("An error occurred during the AJAX request"); }); } }); </script> <div ng-app="app" ng-controller="controller"> <input type="button" ng-click="AddProducts()" value="Get Full Name" /> </div> 
  var headers = {'SourceFrom':'web'}; restUtil.post(url, params, headers).then(function(response){ 

您也可以在{}内发送(POST)多个参数并添加它。