Angularjs 滑块，customValueToPosition 不能与范围选择一起使用答案

【问题标题】：Angularjs slider, customValueToPosition not able work with range selectionAngularjs 滑块，customValueToPosition 不能与范围选择一起使用
【发布时间】：2018-10-13 07:48:46
【问题描述】：

我正在尝试使用 angularjs 滑块进行范围选择和自定义缩放。

这里是滑块选项对象...

vm.priceSlider = {  
    min: 3,  
    high: 10,  
    options: {  
        floor: 0,  
        ceil: 3600,  
        showTicksValues: true,  
        step: 1,  
        ticksArray: ticksArray,  

        customValueToPosition: function(val, minVal, maxVal) {  
            var pos =  1/16 * (ticksArray.indexOf(val));  
            if (positions.indexOf(pos) === -1){  
                positions.push(pos);  
            }  
            return pos;  
          },  

          customPositionToValue: function(percent, minVal, maxVal) {  
            var index = Math.round(percent * 16);  

            var min = (ticksArray[index - 1]);  
            var max = (ticksArray[index]);  

            var minPos = positions[index -1];  
            var maxPos = positions[index];  

            var value = max - ((maxPos-percent)/(maxPos-minPos)) * (max - min);   
            return Math.round(value);  
          }  
        }  
    }

jsfiddle http://jsfiddle.net/cwhgLcjv/2527/

我面临的问题是
1) 滑块指针在除刻度之外的值之间不可见
2) 无法正确选择范围

如果有任何格式错误，我们深表歉意..

【问题讨论】：

标签： angularjs angularjs-3rd-party angularjs-slider

【解决方案1】：

为此，我们需要正确实现 customValueToPosition 和 customPositionToValue 以进行自定义缩放。

      customValueToPosition: function(val, minVal, maxVal) {
        if(!ticksPositions[val]){
            console.log("value => " + val);
            ticksPositions[val] = calculateValuePosition(val);
        }
        return ticksPositions[val];
      },  

      customPositionToValue: function(percent, minVal, maxVal) {  
          var minPos;
          var maxPos;      
        var index = Math.round(percent * 16);
        var min = (ticksArray[index - 1]);
        var max = (ticksArray[index]);
        minPos = ticksPositions[min];
            maxPos = ticksPositions[max];            
        var value = max - ((maxPos-percent)/(maxPos-minPos)) * (max - min); 
        return Math.round(value);
      }

这里是更新的 jsfiddle http://jsfiddle.net/cwhgLcjv/2682/

【讨论】：