knockoutjs 从/到 POCO 对象的映射

Question

有没有办法从 POCO 和 knockoutjs 可观察到映射？

我有一个 Note 类：

public class Note
{
    public int ID { get; set; }
    public string Date { get; set; }
    public string Content { get; set; }
    public string Category { get; set; }
    public string Background { get; set; }
    public string Color { get; set; }
}

这是我的 javascript：

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

function note(date, content, category, color, background) {
    this.date = date;
    this.content = content;
    this.category = category;
    this.color = color;
    this.background = background;
}

function viewModel () {
    this.notes = ko.observableArray([]);
    this.newNoteContent = ko.observable();

    this.save = function (note) {
        $.ajax({
                url: '@Url.Action("AddNote")',
                data: ko.toJSON({ nota: note }),
                type: "post",
                contentType: "json",
                success: function(result) { }

            });
    }

    var self = this;
    $.ajax({
        url: '@Url.Action("GetNotes")',
        type: "get",
        contentType: "json",
        async: false,
        success: function (data) {
            var mappedNotes = $.map(data, function (item) {
                return new note(item.Date, item.Content, item.Category, item.Color, item.Background);
            });
            self.notes(mappedNotes);
        }
    });
}

忽略不使用保存函数的事实（以简化此处的代码）。

因此，当我加载页面时，我调用服务器并检索 Note 对象列表，并将其映射到 JavaScript 中。请注意 ID 是如何未映射的，因为我在视图中不需要它。

到目前为止一切顺利，我在屏幕上看到了注释，但是如何将注释保存回服务器？

我尝试将注释（我只保存新注释而不是整个集合）转换为 JSON 并将其发送到我的控制器，但我不知道如何访问控制器中的注释。我尝试过：

    public string AddNote(string date, string content, string category, string background, string color)
    {
        // TODO
    }

但不起作用。我想要这样的东西：（

public string AddNote(Note note) {}

顺便说一句，仅将数据保存在数据库上的方法的最佳回报是什么？无效？）

那么，我该如何做到这一点？我尝试过 Knockout.mapping 插件，但它非常令人困惑，而且我不让它为我工作。

谢谢。

Answer 1

ASP.NET MVC 的模型绑定器将查找区分大小写的属性。您需要将 JSON 对象传递回服务器，其中属性名称与您的 poco 对象匹配。

我通常会做两件事中的一件：

1. 将我的 javascript 对象属性名称设为大写（在 JS 中这样，我知道该对象在某些时候将成为服务器的 DTO）

   function Note(日期、内容、类别、颜色、背景) {
       this.Date = 日期；
       this.内容=内容；
       this.Category = 类别；
       这.颜色=颜色;
       this.背景=背景；
   };
   

2. 在我的 AJAX 调用中，我将创建一个匿名的要传回服务器的对象（注意这不需要 ko.toJSON）：

   <前><代码>$.ajax({
   url: '@Url.Action("AddNote")',
   数据：JSON.stringify({ 注意：{
   日期：注释.日期，
   内容：注释.内容，
   类别：注释.类别，
   颜色：备注颜色，
   背景：note.background
   }
   }),
   类型：“帖子”，
   contentType: "application/json; charset=utf-8",
   成功：函数（结果）{}
   });

   （同时注意不同的 contentType 参数）

您将希望让您的 ActionMethod 接受 (Note note) 而不仅仅是参数数组。

另外，因为模型绑定程序以几种不同的方式查看发布的值。我很幸运地发布了 JSON 对象，而没有指定 ActionMethod 参数名称：
而不是：

    { note: {
        Date: note.date,
        Content: note.content,
        Category: note.category,
        Color: note.color,
        Background: note.background
        }
    }

只是这样做：（

    {
        Date: note.date,
        Content: note.content,
        Category: note.category,
        Color: note.color,
        Background: note.background
    }

但这可能会因为数组绑定到集合和复杂类型而变得冒险......等等）

至于执行数据库调用的方法的返回的“最佳”签名，我们通常更喜欢看到布尔值，但这也取决于您的需求。显然，如果它是微不足道的数据，则 void 会很好，但如果它更关键一点，您可能需要中继一个布尔值（至少）以让您的客户端知道它可能需要重试（特别是如果存在并发异常） 。

如果您确实需要让客户知道数据库中发生了什么，您可以涉足 自定义错误处理 和 异常捕获。

另外，如果您需要根据成功/不成功的数据库提交向用户显示非常具体的信息，那么您可以考虑创建 自定义 ActionResults，根据数据库事务中发生的情况重定向到某些视图。

最后，就从服务器获取数据并使用 Knockout 而言...

1. 如果您的属性名称相同，或者您创建了一个稍微更明确的映射，那么映射插件将再次工作

2. 我自己的 JS 对象技巧是以下。初始化函数是我创建的，它应该可以在所有对象中重用，因为它只是说“如果属性名称匹配（小写后），则可以通过调用函数（兼容淘汰）来设置它们，或者只是分配值。：< /p>

   function Note(values){ //values 是刚刚从服务器返回的值
       这个日期；
       这个.内容；
       这个.类别；
       这个.颜色;
       这个.背景；
   
       初始化（值）； //在构造函数底部调用原型函数
   };
   
   Note.prototype.initialize = function(values){
       var 实体 = this; //这样我们就不会感到困惑
           var 属性 = '';
           如果（值）{
               for（值中的属性）{
                   if (values.hasOwnProperty(prop.toLowerCase()) &&entity.hasOwnProperty(prop.toLowerCase())) {
                       // setter 应该与值对象上的属性具有相同的名称
   
                       if (typeof (entity[prop]) === '函数') {
                           实体[属性](值[属性]); // 我们假设 setter 仅采用一个参数，如 Knockout observable()
                       } else {// 如果它不是一个函数，那么我们将只设置该值并覆盖之前的值
                           实体[属性] = 值[属性];
                       }
                   }
               }
           }
   };