我需要滑块上的自定义范围,例如1,2,3,4,5,10,15,20,25 .....我们实现了吗?

时间:2019-01-23 08:00:33

标签: javascript angularjs

我需要范围滑块,该范围滑块具有1到5个无间隙,并且每个编号之间有5位数的间隙。像1,2,3,4,5,10,15,20,25,30 ..... 70

<rzslider rz-slider-model="slider.value" rz-slider-options="slider.options"></rzslider>

$scope.slider = {
  value: 100,
  options: {
    floor: 0,
    ceil: 500,
    step: 1,
  }
};

我也尝试了上面的代码,但是它给出了1,5,10,15,20,25..70这样的序列,但是我需要1,2,3,4,5,10,15,20这样的序列, 25,.... 70

enter image description here

感谢有人帮助我。 谢谢!

2 个答案:

答案 0 :(得分:1)

尝试在选项中使用stepsArray

options: {
    stepsArray: [1, 2, 3, 4, 5, 10, 15, 20, 25, 30, 35, 40, 45, 50, 55, 60, 65, 70]
}

答案 1 :(得分:0)

滑块很简单,它以X间隔从X滑动到X。 几乎每次完成不同的缩放比例时,它都是通过一些函数通过将滑块值作为输入来计算之后想要的值来完成的。

input => output:
1 => 1
2 => 2
 ...
6 => 10
7 => 15