从前端嵌套的json数据Post方法不要点击后端post

问题描述

[{"Id":0,"BuyerId":2,"ExpressList":[{"ExpressId":2,"FOBSHANGHAI1":"1"}]}]

此数据来自前端。在“ ExpressList”中,可能有多个数据。 我的后端查看模式是

public class TafettaExpressviewmodel
    {
        public int Id { get; set; }
        public int BuyerId { get; set; }
        public List<ExpressViewDetails> ExpressList { get; set; }
    }
 public class ExpressViewDetails
    {
        public int ExpressId{ get; set; }
        public string FOBSHANGHAI1{ get; set; }
    }

控制器

[HttpPost]
public async Task<ActionResult<TafettaExpressviewmodel>> PostTafetta(List<TafettaExpressviewmodel> data)
        {
            return data.FirstOrDefault();
        }

前端 component.ts

onSubmit() {
    var data = Object.assign({},...this.dataShow); //Data that I wants to send
    this.insertRecord(data)
  }
insertRecord(data) {
this.service.postTafetta(data).subscribe(
  res => {
         console.log(res);
        })}

service.ts

postTafetta(data){
  return this.http.post(this.rootURL+'/Tafetta',data);
}

解决方法

[{"Id":0,"BuyerId":2,"ExpressList":[{"ExpressId":2,"FOBSHANGHAI1":"1"}]}]

根据作为数组的测试数据,您可以尝试修改如下所示的后端代码以接收和处理它。

[HttpPost]
public async Task<ActionResult<TafettaExpressViewModel>> PostTafetta([FromBody]List<TafettaExpressViewModel> data)
{
    return data.FirstOrDefault(); // to see the api hits or not
}

ViewModel类

public class TafettaExpressViewModel
{
    public int Id { get; set; }
    public int BuyerId { get; set; }
    public List<ExpressViewDetails> ExpressList { get; set; }
}

public class ExpressViewDetails
{
    public int ExpressId { get; set; }
    public string FOBSHANGHAI1 { get; set; }
}

测试结果

enter image description here