“离子范围滑块”的最小值/最大值的交互/无功变化

Question

我正在尝试制作一个无功范围滑块。 我有一个下拉列表，其中有一个范围。所以无论何时下拉改变，它都会自动改变范围边栏的范围。

=========模板助手代码================

$("#ionrange_1").ionRangeSlider({ 
     min: Session.get('min'), 
     max: Session.get('max'), 
     type: 'double', 
     prefix: "$", 
     maxPostfix: "+", 
     prettify: false, 
     hasGrid: true 
    }); 

=========== ==============================

我也尝试这一个也在我的模板助手。

定义模板渲染中的范围滑块。

var slider = $("#ionrange_1").data("ionRangeSlider"); 

slider.reset(); 

$("#ionrange_1").ionRangeSlider({ 
      min: Session.get('min'), 
      max: Session.get('max'), 
      type: 'double', 
      prefix: "$", 
      maxPostfix: "+", 
      prettify: false, 
      hasGrid: true 
     }); 

Answer 1

你需要用的代码在你的模板rendered功能于autorun。此外，你应该使用a reactive variable代替可变

会话试试这个：

var self = this; 
self.autorun(function() { 

    var slider = $("#ionrange_1").data("ionRangeSlider"); 

    slider.reset(); 

    $("#ionrange_1").ionRangeSlider({ 
       min: self.min.get(), 
       max: self.max.get(), 
       type: 'double', 
       prefix: "$", 
       maxPostfix: "+", 
       prettify: false, 
       hasGrid: true 
      }); 

}; 

每次更新的无功无功，这段代码也应excecuted（和你的滑块最大/最小值更新）。

您还需要考虑将当前值存储到无功变量中，以便在重新加载滑块后将其设置回去。