Question

出于某种原因，我想在jQuery中调用knockout方法。

Knockout viewModel已经绑定。我不知道如何在jQuery中调用它。

这是我的代码。

$(document).ready() {
  form_submit();
}

function form_submit() {
  var form = $('#form');
  var serializedData = form.serialize();
  $.get("{% url 'search:search' %}", serializedData, function(response) {
    AppViewModel.count(response.count); // I tried this, it says undefined is not a function
    //Then I tried:
    var newModel = new AppViewModel();
    newModel.count(response.count); //No errors, but UI doesn't change. I know it's because I'm not binding it. But I don't think I can binding it, because only 1 ko.binding allowed.
}

function AppViewModel() {
   var self = this;
   self.count = ko.observable(count); //Assume I initially assigned some value to count.
   //some other code below not related to this question.
}

ko.applyBindings(new AppViewModel());

希望有人可以提供帮助。谢谢！

Answer 1

为什么在对变量应用绑定之前，不将调用new AppViewModel的结果分配给变量？然后，您可以在jQuery get回调中引用该变量。

如下所示：

$(document).ready(function() {
    form_submit();
});

var vm = new AppViewModel();

function form_submit() {
    var form = $('#form');
    var serializedData = form.serialize();
    $.get("{% url 'search:search' %}", serializedData, function(response) {
        vm.count(response.count);
    });
}

function AppViewModel() {
   var self = this;
   this.count = ko.observable(count);
}


ko.applyBindings(vm);

您还可以绑定到表单的提交事件，这样可以简化您的部分代码组织。

例如，在以下HTML中，我绑定到我的表单提交事件：

<div id="myHTML">
    <form data-bind="submit: myFormHandler">
        <!-- form inputs here -->
    </form>
</div>

然后在我的视图模型中，我有以下内容：

function AppViewModel() {
    this.count = ko.observable();

    this.myFormHandler = function(formElement) {
        var self = this;
        var serializedData = $(formElement).serialize();
        $.get("{% url 'search:search' %}", serializedData, function(response) {
            self.count(response.count);
        });
    }
}

$(document).ready(function() {
    var vm = new AppViewModel();

    ko.applyBindings(vm, $("#myHTML")[0]);
});

请注意，在上面的示例中，我将绑定范围限定为myHTML div。

jquery调用淘汰赛方法

1 个答案: