字母范圍的角度滑塊

Question

我正在為學校開發一個有角度的網站。 我正在嘗試選擇類別的滑塊（類別1至類別5）。這些類別以數組形式提供，因此在完成滑動時應顯示開始類別和結束類別。

類數組：

$scope.classArry = [{
  "code": "LKG",
  "decode": "LKG"
}, {
  "code": "UKG",
  "decode": "UKG"
}, {
  "code": "1",
  "decode": "class 1"
}, {
  "code": "2",
  "decode": "class 2"
}, {
  "code": "3",
  "decode": "class 3"
}, {
  "code": "4",
  "decode": "class 4"
}, {
  "code": "5",
  "decode": "class 5"
}, {
  "code": "6",
  "decode": "class 6"
}, {
  "code": "7",
  "decode": "class 7"
}, {
  "code": "8",
  "decode": "class 8"
}, {
  "code": "9",
  "decode": "class 9"
}, {
  "code": "10",
  "decode": "class 10"
}, {
  "code": "11",
  "decode": "class 11"

}，{“ code”：“ 12”，“ decode”：“ class 12”}];

當我從一個班級拖到另一個班級時，結果應該像第1級班級10。

Answer 1

您所要做的就是更改上述代碼塊中的“ $ scope.validValues”。 我在上面分叉，似乎正在顯示類名。 在這里檢查

“翻譯”功能是您的朋友-您可以在此處進行各種操作以根據需要顯示。

$scope.validValues = [{
  "code": "LKG",
  "decode": "LKG"
}, {
  "code": "UKG",
  "decode": "UKG"
}, {
  "code": "1",
  "decode": "class 1"
}, {
  "code": "2",
  "decode": "class 2"
}, {
  "code": "3",
  "decode": "class 3"
}, {
  "code": "4",
  "decode": "class 4"
}, {
  "code": "5",
  "decode": "class 5"
}, {
  "code": "6",
  "decode": "class 6"
}, {
  "code": "7",
  "decode": "class 7"
}, {
  "code": "8",
  "decode": "class 8"
}, {
  "code": "9",
  "decode": "class 9"
}, {
  "code": "10",
  "decode": "class 10"
}, {
  "code": "11",
  "decode": "class 11"}
  ];

Answer 2

plunker鏈接我已經做了類似的措施。 希望對您有幫助

var formattedSliderValidValues = 


 {
   floor: codeArray[0],
   ceil: codeArray[codeArray.length-1],        
   value: 0,
   maxVal:11,
   translate : translate,
   incrSpeed : incrFun,
   decrSpeed  : decrFun,
   codeArray : codeArray,
   stepArray : codeArray,
   valueArray : valueArray,
   selection : true,
  displayScale : true,
   typedValue: codeArray[0],
   hidePointerLabels: true
   };

返回formattedSliderValidValues; };