Question

在我的应用程序中，我每隔5秒定期进行一次ajax调用，以便从服务器获取新的更新。

来自服务器的我的ajax数据是JSON数组，如下所示： [ { “foo”：“valx”， “bar”：“valy”

}， { “foo”：“valw”， “bar”：“valz” } ]

我的ajax代码是：

(function update() {

    $.ajax({
        type : 'GET',
        url : url,
        data : {

        },
        dataType : "json",
        global : false,
        success : function(content, textStatus, jqXHR) {
        myViewModel = content;
        ko.applyBindings(myViewModel);

        },
        complete: function() {

         setTimeout(update, 5000);
          },

        error: function( xhr, textStatus ) {

            }
    });
    })();

我的HTML是：

<tbody data-bind="foreach: myViewModel">
                        <tr>
                            <td data-bind="text: foo"></td>
                            <td data-bind="text: bar"></td>
                        </tr>
                    </tbody>

但这不起作用，我在第一次ajax调用后得到错误：您不能多次将绑定应用于同一元素。

Answer 1

你很亲密。您只需拨打applyBindings一次。相反，您应该做的是在视图模型上设置observable属性。

以下是设置视图模型的方法：

function ViewModel() {
    var self = this;

    self.data = ko.observableArray();
};

var viewModel = new ViewModel();

ko.applyBindings(viewModel);

然后，当您有新数据时（例如在ajax通话中）：

$.ajax({
    success : function(content, textStatus, jqXHR) {
        viewModel.data(content);
    }
});

注意：您可以通过几种不同的方式设置数据。如果您希望在视图模型之外定时事件，则可以使用视图模型实例（在我的示例中为viewModel）来访问属性并更新它们。如果需要，您可以将定时事件放在视图模型中，然后只需调用self.data(content)（或类似的东西）。

当ajax请求定期自动刷新时如何使用knockout.js数据绑定？

1 个答案: