更新模型不会更新视图答案

【问题标题】：Updating the model does not update the view更新模型不会更新视图
【发布时间】：2013-05-26 09:18:13
【问题描述】：

我正在使用我认为被普遍接受的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() 函数，它在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

【问题讨论】：

标签： javascript knockout.js jquery-select2 bindinghandlers

【解决方案1】：

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

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

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

【讨论】：

不确定我是否理解这个问题。一切似乎都按预期工作。 setTimeout 更改值，然后 UI 更新。
抱歉，之前的评论看错了小提琴。但是您的小提琴实际上正在摆脱 OP 使用的特殊 select2 下拉菜单。你没有解决问题，你只是完全删除了插件。
他的小提琴包含select2 插件，顺便说一句。查看外部资源。
更新后的小提琴没有使用 Select2 插件呈现下拉菜单？
看起来它现在可以按您的意愿工作了。请参阅：jsfiddle.net/tkirda/Mmuvx/5 最初我没有注意 select2 插件的作用。