Question

我在下面有一些代码，以确保用户不需要单击任何按钮并将所有输入更新到服务器端。服务器端代码负责执行任何计算并将更新的JSON发送回客户端。

这里的问题是手动订阅代码将检测用户输入更改，它将调用函数将JSON数据发布到服务器并从服务器接收JSON。从这一点开始，它将尝试通过调用ko.mapping.updateFromJS(viewModel, data);来更新视图模型，但此处会发生死锁。 updateFromJS将再次触发手动订阅事件，从而再次调用服务器代码，从而触发另一轮手动订阅。

var initialData = /* get JSON from server side */;

var viewModel = ko.mapping.fromJS(initialData);

ko.applyBindings(viewModel, document.body);

viewModel.Product.Parameter1.subscribe(function(newValue) {
    postToServer();
});

viewModel.Product.Parameter2.subscribe(function(newValue) {
    postToServer();
});

viewModel.Product.Parameter3.subscribe(function(newValue) {
    postToServer();
});

function getProduct() {
    // retrieve JSON data to be posted to server side
}

function postToServer() {
    var product = getProduct();

    $.ajax({
        url: '/Home/ProductUpdate/',
        data: JSON.stringify(product),
        type: "POST",
        dataType: 'json',
        contentType: 'application/json; charset=utf-8',
        success: function (data) {
            // update JSON returned from server side to observable view-model
            ko.mapping.updateFromJS(viewModel, data);
        }
    });
}

是否可以执行以下任一操作：

在调用ko.mapping.updateFromJS时禁用手动订阅？（之后恢复）。
手动订阅是否会忽略ko.mapping.updateFromJS来电所触发的事件？

Answer 1

你能用这样的变量做到这一点：

<script language="javascript" type="text/javascript">
var initialData = /* get JSON from server side */;

var viewModel = ko.mapping.fromJS(initialData);

var preventUpdate = false;

ko.applyBindings(viewModel, document.body);

viewModel.Product.Parameter1.subscribe(function(newValue) {
    if (!preventUpdate) postToServer();
});

然后在postToServer函数

中

success: function (data) {
    // update JSON returned from server side to observable view-model

    preventUpdate = true;
    ko.mapping.updateFromJS(data, viewModel);
    preventUpdate = false;
}

手动订阅并调用updateFromJS会导致死锁

1 个答案: