Knockout.js 如何在使用敲除和映射插件时将错误附加到字段？

我是一个Knockout.js新手，正在尝试解决问题。我为我的用户提供了此模型：

var UserModel = function(data)
{
    ko.mapping.fromJS(data, {}, this);

    // Other non-relevant stuff

    this.errors = ko.observableArray();

    this.save = function()
    {
        $.ajax({
            type: 'PUT',
            url: API+'user',
            data: ko.mapping.toJSON(this),
            contentType: 'application/json',
            context: this,
            success: function(data)
            {
                ko.mapping.fromJS(data, {}, this);
            },
            error: function(jqxhr, status, error)
            {
                if(jqxhr.responseJSON.errors)
                    this.errors(jqxhr.responseJSON.errors);
            },
        });
    };
}

当put失败时，

错误

会被填充，至少在我看来是这样的：

<pre data-bind="text: ko.toJSON($root, null, 2)"></pre>

{
  "id": 2,
  "email": "alice@example.com",
  "name": "Alice",
  "roles": "login",
  // Other non-relevant stuff
  "errors": {
    "email": [
      "Invalid email domain."
    ],
    "name": [
      "Cannot be empty."
    ]
  }
}

{
“id”：2，
“电子邮件”：alice@example.com",
“姓名”：“爱丽丝”，
“角色”：“登录”，
//其他不相关的东西
“错误”：{
“电子邮件”：[
“无效的电子邮件域。”
],
“姓名”：[
“不能为空。”
]
}
}

但是，使用下面的模板，如何在错误所属的每个字段旁边显示这些错误

我当前为用户使用的模板如下所示：

<script type="text/html" id="user-row">
    <tr spellcheck="false">
        <td>
            <div data-key="Name" data-bind="editable: editing, editableValue: name"></div>
        </td>
        <td>
            <div data-key="Email" data-bind="editable: editing, editableValue: email"></div>
        </td>
        <td>
            <div data-key="Roles" data-bind="editable: editing, editableValue: roles"></div>
        </td>
        <td>
            <a href="javascript:void(0)" data-bind="click: save">Save</a>
        </td>
    </tr>
</script>

当没有键时，如何绑定到错误文本

如何在每个

div

下按键绑定“筛选的”

---

在您的代码

中，this.errors

声明为可观察数组，但根据JSON响应，您分配了一个对象

您可能会发现我经常使用的方法非常有用，可以扩展特定可观察对象和可观察数组的功能。我只是用有用的方法（和/或甚至是计算值）扩展它们

this.errors=ko.observable（）；
//使用允许获取指定字段错误（如果存在）的方法扩展observable
this.errors.get=函数（字段）{
var errs=this.errors（）；
返回errs&&errs[field]&&errs[field]。join（“；”）；
};
//在HTML中，每个div下都有可编辑的绑定：

*facepalm*，没有想到它是一个对象。在PHP中，它是一个关联数组，我认为每个字段也可能有多个错误，但实际上我没有。明天我会试用你的分机，看起来很方便。就是我想要的那种小费

this.errors = ko.observable();

// extend observable with a method that allows to get errors for specified field if they exist
this.errors.get = function(field){
    var errs = this.errors();
    return errs && errs[field] && errs[field].join(";");
};

// further in HTML under every div with editable binding:
<span class="error" data-bind="text: errors.get('email')"></span>