在meteor中初始化No UI Slider的多个实例

如何在Meteor中初始化无UI滑块的多个实例？ 我想在页面上有多个滑块。

我一直在努力……

模板：

JS：

 Template.task.rendered = function() { $('#slider'+this._id).noUiSlider({ start: 5, connect: "lower", step: 0, format: wNumb({ decimals: 0, }), range: { 'min': 0, 'max': 10 } }); $('#slider'+this._id).Link('lower').to($('#range'+this._id)); }; 

调用this._id不会做任何事情……不管怎样，它需要遍历所有的postID，直到匹配为止，比如在做Tasks.findOne（）; 并与DOM中的最新情况进行比较。

如果有更好的方法这样做…请告诉我！

编辑：

我更新了我的代码，遵循其他实例的结构，其中插件在同一页面上多次初始化，使用$ this和.each

模板：

JS：

  Template.task.rendered = function() { $('.slider').each(function() { var $this = $(this); $this.noUiSlider({ start: 5, connect: "lower", step: 0, format: wNumb({ decimals: 0, }), range: { 'min': 0, 'max': 10 } }); $this.Link('lower').to($('.range')); }); }; 

在控制台中，这给了我错误，“错误：滑块已经初始化。”

Answer 1

我需要把’这个’放在正确的地方……

  Template.task.rendered = function () { this.$('.slider').noUiSlider({ start: 5, connect: "lower", step: 0, format: wNumb({ decimals: 0, }), range: { 'min': 0, 'max': 10 } }); this.$('.slider').Link('lower').to(this.$('.range')); } 

看看RateIt，一个具有类似用法的插件帮我搞清楚了。