Question

我使用的是我认为普遍接受的ko.bindingHandler.select2：

ko.bindingHandlers.select2 = {
  init: function (element, valueAccessor) {
      $(element).select2(valueAccessor());

      ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
          $(element).select2('destroy');
      });
  },
  update: function (element) {
      $(element).trigger('change');
  }
};

然而，这似乎有几个问题。在这个问题中，我想找到一个答案，了解如何在更改模型时进行View更新。

我创建了jsFiddle来证明这个问题。我有一个简单的setTimeout()函数，它在0.25秒后设置模型的selectedValue来模拟类似于通过Ajax调用的模型加载数据的行为。在示例中，当使用Select2时，下拉值不会更新，但对于正常下拉列表似乎正常工作。

完整解决方案： 我更新的自定义绑定现在看起来像这样......

ko.bindingHandlers.select2 = {
init: function (element) {
    $(element).select2({});

    ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
        $(element).select2('destroy');
    });
},
update: function (element, valueAccessor) {
    var value = valueAccessor();
    var valueUnwrapped = ko.utils.unwrapObservable(value);
    $(element).val(valueUnwrapped).trigger('change');
}

};

在我的HTML中，我现在将值传递给自定义绑定。

data-bind="select2: selectedValueS2

Answer 1

好吧，似乎我能够找出问题所在。如果您在值更改时更新下拉列值，然后调用触发器，则它将起作用：

$(element).val(value()).trigger('change');

http://jsfiddle.net/tkirda/Mmuvx/5/

更新模型不会更新视图

1 个答案: