使用 KnockoutJS 初始化后更新引导日期选择器

Question

我正在使用带有以下自定义 KnockoutJS 绑定的 Bootstrap 日期选择器，直到现在它对我来说都很好：

ko.bindingHandlers.datepicker = {
  init: function(element, valueAccessor, allBindingsAccessor) {
    //initialize datepicker with some optional options
    var options = allBindingsAccessor().datepicker || {};

    $(element).datepicker(options);

    //when a user changes the date, update the view model
    ko.utils.registerEventHandler(element, "changeDate", function(event) {
      var value = valueAccessor();
      if (ko.isObservable(value)) {
        value(event.date);
      }                
    });
  },
  update: function(element, valueAccessor)   {
    var widget = $(element).data("datepicker");
    //when the view model is updated, update the widget
    if (widget) {
      widget.date = ko.utils.unwrapObservable(valueAccessor());
      widget.setValue();            
    }
  }

};

现在，我有一种情况，我在 datepicker 初始化发生之后 获得了 startDate 和 endDate 值。我在这里设置了一个示例：

http://jsfiddle.net/6WR5r/

日期选择器使用正确的日期初始化，但是当我点击“更改日期”按钮时，日期选择器没有更新，即使自定义绑定上的 update 函数被触发。

我尝试了 update 函数的不同版本，但没有成功：

update: function(element, valueAccessor, allBindingsAccessor)   {
  var options = allBindingsAccessor().datepicker || {};
  $(element).datepicker(options);
}

update: function(element, valueAccessor, allBindingsAccessor)   {
  $(element).datepicker('update');
}

唯一有效的是使用setStartDate 和setEndDate 方法，如下所示：

update: function(element, valueAccessor, allBindingsAccessor) {
  var options = allBindingsAccessor().datepicker || {};

  $(element).datepicker('setStartDate', options.startDate);
  $(element).datepicker('setEndDate', options.endDate);
}

但我正在寻找更好的方法。有没有办法使用update 函数用新值更新日期选择器，而不必指定要更新的选项？

Answer 1

所以在两个问题中你让我写了两个丑陋的解决方案......

Apparently你需要删除插件并在你想更改startDate或endDate时重新创建它:(

你的更新函数变成：

update: function(element, valueAccessor, allBindingsAccessor) {
    console.log("update fired");

     //when the view model is updated, update the widget
    if ($(element).data("datepicker")) {
        $(element).datepicker("remove");
        var options = allBindingsAccessor().datepicker || {};
        $(element).datepicker(options);
        $(element).data("datepicker").date = ko.utils.unwrapObservable(valueAccessor());
        $(element).data("datepicker").setValue();            
    } 
}

Demo