2

我正在使用我认为被普遍接受的东西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');
  }
};

但是，这似乎有几个问题。在这个问题中，我想找到一个关于如何在对模型进行更改时更新视图的答案。

我创建了一个jsFiddle来演示这个问题。我有一个简单的setTimeout()函数，可以selectedValue在 0.25 秒后设置模型，以模拟类似于模型通过 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
4

1 回答 1

2

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

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

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

于 2013-05-30T19:50:33.750 回答