Question

我有两个ViewModel对象 TalentViewModel 和 EditTalentViewModel 。以下是各自的代码：

TalentViewModel

public class TalentViewModel
{
    [JsonProperty(PropertyName = "TalentId")]
    public long TalentId { get; set; }
    [JsonProperty(PropertyName = "TalentName")]
    public string TalentName { get; set; }
}

EditTalentViewModel

public class EditTalentViewModel
{
    [JsonProperty(PropertyName = "AddedTalents")]
    public List<TalentViewModel> AddedTalents { get; set; } 
    [JsonProperty(PropertyName = "RemovedTalents")]
    public List<TalentViewModel> RemovedTalents { get; set; } 
}

我将json数据发送到action方法，该方法使用ajax调用接受 EditTalentViewModel 作为参数。这是发送ajax请求的angularJs代码

//this will send the json data to InterestController
$scope.saveInterest = function (talents) {
    $http({
        method:"POST",
        url:"/Interest/AddTalents",
        data: {talents},
        headers: {
            'Content-type': "application/json"
        },
        responseType:"json"
    }).success( function(data){
        console.log(data);

    }).error( function(data){
        console.log("Error happening");
    });
}

我使用了this answer中建议的自定义模型绑定器，并将其用作 EditTalentViewModel 对象的模型绑定器。以下是操作方法的一部分：

[HttpPost]
public ActionResult AddTalents([ModelBinder(typeof(JsonModelBinder))]EditTalentViewModel talents)
{
    if (!ModelState.IsValid) return Json("Fail");
    var userId = User.Identity.GetUserId<long>();
    if (talents.AddedTalents == null && talents.RemovedTalents == null)
    {
        return Json("Success");
    }
    //.........
}

发送的JSON数据样本如下所示：

{
    "AddedTalents": [{
        "TalentId": 10,
        "TalentName": "Sculptor"
    }, {
        "TalentId": 8,
        "TalentName": "Painter"
    }],
    "RemovedTalents": [{
        "TalentId": 2,
        "TalentName": "Dj"
    }]
}

但是，当我调试代码时， EditViewModel 类的 AddedTalents 和 RemovedTalents 属性为null。我在这里错过了什么？我怎么解决这个问题？还有更好的方法来进行模型绑定吗？

Answer 1

talents是您想要作为请求主体POST到服务器的对象的集合。所以错误的是你已经用talents包裹了{}，因为talents已经是对象的集合，所以不需要它。

$http({
    method:"POST",
    url:"/Interest/AddTalents",
    data: talents, //<--change here, removed unwanted {}
    headers: {
       'Content-type': "application/json"
    },
    responseType:"json"
})

复杂对象未绑定到JSON数据

1 个答案: