[英]Angular slider for alphabet range
I am developing an angular website for a school. 我正在为学校开发一个有角度的网站。 I am trying out slider for selecting classes.(class 1 to class 5).The classes are provided as arrays so when sliding is done start-class and end-class should be display.
我正在尝试选择类别的滑块(类别1至类别5)。这些类别以数组形式提供,因此在完成滑动时应显示开始类别和结束类别。
Class Array: 类数组:
$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" } ]; },{“ code”:“ 12”,“ decode”:“ class 12”}];
When I drag from a class to other class the result should be like, class 1-class 10. 当我从一个班级拖到另一个班级时,结果应该像第1级班级10。
All you have to do is change the '$scope.validValues' in above plunker. 您所要做的就是更改上述代码块中的“ $ scope.validValues”。 I forked the above and it seems to be displaying the class names.
我在上面分叉,似乎正在显示类名。 Check here
在这里检查
'translate' function is your friend- you can do all sorts of manipulations here to display however you want. “翻译”功能是您的朋友-您可以在此处进行各种操作以根据需要显示。
$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"}
];
plunker link I have done something similar to this. plunker链接我已经做了类似的措施。 Hoping that this might help you
希望对您有帮助
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
};
return formattedSliderValidValues; 返回formattedSliderValidValues; };
};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.