如何在具有多个参数的angularjs中发送POST？

Question

我想使用angularjs HTTP post service发送多个参数.

这是客户端代码:

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

但是当我发帖时我得到了错误.知道我做错了什么吗？

Answer 1

客户端

数据需要在对象数组中作为有效负载分组 - 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"); 
});

服务器端

创建数据传输对象(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包含值为product和的2个属性product2

Answer 2

考虑一个带有参数user和email的帖子网址

params对象将是

 var data = {user:'john', email:'john@email.com'};
    $http({
      url: "login.php",
      method: "POST",
      params: data
    })

Answer 3

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

否则,您需要转换数据的最佳方式来创建工厂将数据转换为 id = 1&name = name&...

然后在$ http定义内容类型.你可以找到完整的文章@ 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 () {});

参考:如何在AngularJS中使用$ http发布urlencoded表单数据？

!important 关于encodeURIComponent(obj [p])将以隐式的方式传递对象.就像一个日期值将转换为一个字符串,如'>'Fri Feb 03 2017 09:56:57 GMT-0700(美国山地标准时间)',我不知道你怎么能解析它至少在后面 - 结束C#代码.(我的意思是代码不需要超过2行)你可以在日期的情况下使用(angular.isDate,value.toJSON)将它转换为更有意义的后端代码格式.

我正在使用此功能来通信我的后端webservices ...

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

和以下代码使用它...

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

在后端C#我正在使用newtonsoft来反序列化数据.