Knockout JS - 您不能将绑定多次应用于同一元素 - MVC

Knockout JS - you cannot apply bindings multiple times to the same element - MVC

我是 Knockout js 的新手,不明白为什么会出现此错误。

我在 .net mvc 中有一个视图,当单击按钮时使用 jquery 使用 ajax 查询数据库,然后使用 returns 数据,然后我将其传递给 knockout要呈现,当您单击按钮时,它会打开一个模态 window 并显示数据正常,但它只会在显示多元素错误后每隔一秒执行一次。

有什么想法吗?

 var ViewModel = function (docs) {

  this.docs = ko.observable(docs);

};

$('.js--click').click(function () {

    var id = $(this).data('id');

        $.post("GetData", { id: id })
           .done(function (data) {

             ko.applyBindings(new ViewModel(data.docs));
    });
});


<div data-bind="if: docs()">
<span data-bind="text: docs></span>
</div>

就像错误信息说的那样:你只能在同一个元素上调用一次ko.applyBindings。您只想更新视图模型上的可观察对象;这不是这样做的方法。

使用 Knockout 做事的标准方法是在视图模型上有一个函数来获取数据,然后用这个新数据更新一个可观察对象,然后 UI 将自动同步。您将使用标准的 KO click 处理程序将点击事件附加到按钮,而不是使用 jQuery.

以您的示例为例,您必须按照以下方式做一些事情:

function ViewModel () {
    var vm = this;

    vm.docs = ko.observable();

    vm.getData = function (id) {
        $.post("GetData", { id: id })
         .done(function (data) {
            vm.docs(data.docs);
    });
    }
};

ko.applyBindings(new ViewModel()); // We only do this once!


<button data-bind="click: getData.bind($data, 'myID')"></button>

<div data-bind="if: docs">
    <span data-bind="text: docs"></span>
</div>