javascript - 使用 Knockout.js 和映射的 ASP.NET

Question

使用以下代码我遇到了一个奇怪的问题。当我单击并调用 showVacationModal 时，从服务器中检索到数据并正确显示结果。如果我继续点击同一个人（id），它会继续工作。

如果我单击没有假期的其他人（例如不同的 ID），则不会显示任何内容 = OK。

问题

现在，当我再次单击第一个人时，什么都没有显示。（在 ajax 调用中可以很好地检索数据）。

有任何想法吗？

我的 JS 代码：

var ViewModel = function () {
        this.vacations = ko.mapping.fromJS(null);
    };

    var model = new ViewModel();


    function showVacationModal(id) {
        var model = {};
        $.ajax({
            type: "POST",
            url: "Default.aspx/GetVacations",
            data: "{personId: '" + id + "'}",
            delay: 1,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) {

                model.vacations = ko.mapping.fromJS(msg.d);
                ko.applyBindings(model);


                $('#vacationModal').modal('show')
            }
        });

    }

我的 HTML：

<table>
                <thead>
                    <tr>
                        <th>
                            First name
                        </th>
                        <th>
                            Last name
                        </th>
                    </tr>
                </thead>
                <tbody data-bind="foreach: vacations">
                    <tr>
                        <td data-bind="text: Id">
                        </td>
                        <td data-bind="text: PersonId">
                        </td>
                        <td data-bind="text: Begin">
                        </td>
                    </tr>
                </tbody>
            </table>

Answer 1

你有没有尝试过更多这样的事情？

function showVacationModal(id) {
    // var model = {}; no need to reset the model property
    $.ajax({
        type: "POST",
        url: "Default.aspx/GetVacations",
        data: { personId: id }, // why wrap data in strings?
        delay: 1,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (msg) {

            //model.vacations = ko.mapping.fromJS(msg.d);
            ko.mapping.fromJS(msg.d, {}, model.vacations);
            // ko.applyBindings(model); no need to reapply bindings

            $('#vacationModal').modal('show')
        }
    });
}

有关更多信息，请参阅此 ko.mapping 文档部分。