Question

我对淘汰赛和使用可观察者的一些问题相对较新。这是我正在使用的一些淘汰赛的配对版本：

var model;
function viewModel(data) {
    var self = this;       
    self.favesData = ko.observableArray(data.User.Favorites);       
    self.splitRows = ko.computed(function () {
        var i = 0;
        var faveRows = [];
        var size = 2;
        while (i < self.favesData().length) {
            faveRows.push(self.favesData().slice(i, i += size));
        }
        return faveRows;
    });

    self.refresh = (function (data) {
        self.favesData(data.User.Favorites);
    });
}

function onComplete(result) {
    if (!model) {
        model = new viewModel(result);
        ko.applyBindings(new viewModel(result));
    } else {
        model.refresh(result);
    }
}

<table class="table-main link" data-bind="foreach: splitRows">
    <tr data-bind="foreach: $data">
        <td>
            <div class="link">
                <a href="#" data-bind="text: $data.Name">
                </a>
            </div>
        </td>
     </tr>
 </table>

我使用ajax GET，它调用onComplete。数据很好，一切都在初始负载上很好。然后我用新输入调用相同的ajax函数，它开始正常工作 - 返回的数据不同，刷新更新favesData和splitRows重新计算，但UI显示永远不会改变。 splitRows在重新计算时不应更新绑定吗？我很困惑如何将新数据传递给favesData可以更新监视它的计算observable，但计算的observable不会更新UI。

Answer 1

在你的onComplete方法中，你没有将Markup绑定到模型，而是绑定到viewModel的新实例，它应该如下所示。

ko.applyBindings(model);

在UI未使用的模型上调用刷新

Answer 2

尝试clearing the array and pushing the new items in，例如;

 self.favesData.removeAll();
 data.User.Favorites.each(function(fav) { self.favesData.push(fav); });

看看是否对其进行排序。我倾向于使用官方knockout mapping plugin，它可以很好地处理服务器中的'knockouting-up'模型并刷新它们。

通常情况下，您最终会通过在viewmodel

中执行此类操作来刷新

self.refresh = function(data) {
    ko.mapping.fromJS(data, {}, self);
}

重新绑定整个模型。

KO计算重新计算但不更新UI

2 个答案: