淘汰视图模型部分回发到 ASP.NET MVC - 如何回发完整对象？

Question

拥有这些 ASP.NET MVC 视图模型：

public class User
  {
    public string Name { get; set; }
    public LabeledEmail LabeledEmail { get; set; }
  }
public class LabeledEmail
  {
    public IList<ContactLabel> Labels;
    public IList<ContactEmail> Emails;
  }

和像这样的 Knockout 视图模型：

  <script type="text/javascript">

    $(function() {
      ko.applyBindings(viewModel);

      $("#profileEditorForm").validate({
    submitHandler: function(form) {
      if (viewModel.save())
        window.location.href = "/";
      return false;
    }
      });
    });

    var viewModel = {

      Name: ko.observable("@Model.Name"),

      EmailLabels: ko.observableArray(@Html.Json(Model.LabeledEmail.Labels.Select(l => l.Name)) || []),
      Emails: ko.observableArray(@Html.Json(Model.LabeledEmail.Emails) || []),

      addEmail: function() {
    viewModel.Emails.push(@Html.Json(new ContactEmail()));
      },
      removeEmail: function(eml) {
    viewModel.Emails.remove(eml);
      },

      saveFailed: ko.observable(false),

      // Returns true if successful
      save: function() {
    var saveSuccess = false;
    viewModel.saveFailed(false);

    jQuery.ajax({
      type: "POST",
      url: "@Url.Action("MyAction", "MyController")",
      data: ko.toJSON(viewModel),
      dataType: "json",
      contentType: "application/json",
      success: function(returnedData) {
        saveSuccess = returnedData.Success || false;
        viewModel.saveFailed(!saveSuccess);
      },
      async: false
    });     
    return saveSuccess;
      }
    };
</script>

正确回传到控制器的是User.Name，但User.LabeledEmail 是空的。 我必须按照我的方式展平模型，以便能够在其他地方单独使用列表。 我知道 viewModel.Emails 在保存时已正确填充，但 User.LabeledEmails 以某种方式返回 null。

这基本上归结为将Model.LabeledEmail.Emails 分配给viewModel.Emails 并且似乎可以解决交易，但我不知道如何并且找不到任何合适的示例。

1. 我犯了什么错误和
2. 如何正确操作？

提前谢谢你。

Answer 1

您的 JSON 数据结构应与 C# 类的结构相匹配，尤其是属性名称。所以你需要发送一个看起来像这样的 JSON：

{
    Name: 'somename',
    LabeledEmail: {
        Labels: [ somelements ],
        Emails: [ someelements ]
    }
}

所以改变你的data: ko.toJSON(viewModel),：

data: JSON.stringify({
   Name: viewModel.Name(),
   LabeledEmail: { 
       Labels: viewModel.EmailLabels(),
       Emails: viewModel.Emails()
   }
})

或者只是在客户端和服务器上使用相同结构的数据...

附带说明：您的 C# 视图模型需要具有属性而不是字段才能使 MVC 模型绑定器正常工作：

public class User
{
    public string Name { get; set; }
    public LabeledEmail LabeledEmail { get; set; }
}

public class LabeledEmail
{
    public IList<ContactLabel> Labels { get; set; }
    public IList<ContactEmail> Emails { get; set; }
}