Обновление диапазона слайдера afer binding update

Question

Я делаю слайдер диапазона, используя объясненный вопрос here, но у меня такая же проблема с одним из комментариев по второму ответу: после обновления моих значений привязки он не обновляет слайдер диапазона вот мой код:

HTML:

<div id="slider-range" style="border: 1px solid #787878;" data-bind="slider: range, sliderOptions: { min: minPrice(), max: maxPrice(), step: 1, range:true }"> 

// FlexSlider привязки обработчика

ko.bindingHandlers.slider = { 
     init: function (element, valueAccessor, allBindingsAccessor) { 
      var options = allBindingsAccessor().sliderOptions || {}; 
      var observable = valueAccessor(); 

      if (observable().splice) { 
       options.range = true; 
      } 

      options.slide = function (e, ui) { 
       observable(ui.values ? ui.values : ui.value); 
      }; 

      ko.utils.domNodeDisposal.addDisposeCallback(element, function() { 
       $(element).slider("destroy"); 
      }); 

      ko.utils.registerEventHandler(element, "slide", function (event, ui) { 
       observable(ui.values ? ui.values : ui.value); 
      }); 

      $(element).slider(options); 
     }, 
     update: function (element, valueAccessor) { 
      var value = ko.utils.unwrapObservable(valueAccessor()); 
      if (value instanceof Array) { 
       var value1 = ko.utils.unwrapObservable(value[0]); 
       var value2 = ko.utils.unwrapObservable(value[1]); 
       if (value1) { 
        value = [value1, value2]; 
       } 
       else value = 0; 
      } 
      else if (isNaN(value)) value = 0; 
      $(element).slider(value.slice ? "values" : "value", value); 
      // $(element).slider(value.slice ? "values" : "value", value); 
     } 
    }; 

мой ViewModel:

function viewmodel() { 
self.minPrice = ko.observable(0); 
     self.maxPrice = ko.observable(2000); 
self.range= ko.observableArray([self.minPrice(), self.maxPrice()]); 
}; 

, когда я применяю запрос $ АЯКСА, я перезарядить свои данные с помощью функции, как это:

self.loadDataFromServer = function (data) { 

      self.minPrice(data.minPrice); 
      self.maxPrice(data.maxPrice); 
      self.range([self.minPrice(), self.maxPrice()]); 

     } 

но страница не обновлять range.I будет apretiate некоторой помощи.

Answer 1

Я нашел ответ на другой вопрос here

изменения обновления часть с этим:

update: function (element, valueAccessor, allBindingsAccessor) { 
      var value = ko.utils.unwrapObservable(valueAccessor()); 
      $(element).slider(value.slice ? "values" : "value", value); 
      $(element).slider("option", allBindingsAccessor().sliderOptions) 
     } 

upated пример here