其他人有没有角度和范围滑块的麻烦？

似乎是一个不可能完成的任务，可以找到一个与ng-repeat配合使用并且可以垂直显示的范围滑块。任何人都有关于下一步尝试的想法？其他人有没有角度和范围滑块的麻烦？

我试图做一个让你可以在一天中的每个小时手动控制标志亮度的地方。目前的想法是堆叠24个垂直范围滑块彼此相邻，每个滑块控制当时的亮度，第25个滑块是一个主控制器，可同时调整所有其他24个滑块。

我最接近的是角度滑行滑板，但是当它与ng-repeat一起使用时，它变得非常麻烦。我想我可以手动写出所有25个，但我宁愿不要。

另一个想法是使用jqPlot，因为您可以拖动数据点。（它似乎是唯一的图表库，您可以在其中拖动数据点（请纠正我，如果我错了））

来源

2015-06-19 ds011591

如果他们没有很好地工作，你的事情的问题可能是什么，他们都有一个共同特点？（换句话说，可能是一个实施问题？） –

HTML5范围输入如何？

HTML：

<input type="range" 
    orient="vertical" 
    ng-repeat="slider in sliders" 
    ng-model="slider.val" />

CSS（有必要使其在一些浏览器垂直）：

input[type=range][orient=vertical] { 
    writing-mode: bt-lr; /* IE */ 
    -webkit-appearance: slider-vertical; /* Webkit */ 
    width: 20px; 
    height: 200px; 
}

正常工作与角绑定。 Here's a Plunker。

Supported browsers look to be IE10+ and most others。

来源

2015-06-19 15:24:11 Agop

我的我怎么会用这个

创建空对象的数组plunker作了为例。

$scope.sliders = []; 
for(var i=0; i<5; i++){ 
    $scope.sliders.push({}); 
}

我使用显示HTML使用范围的输入

<span ng-repeat="slider in sliders track by $index"> 
    <input ng-init="slider.value = 0" type="range" ng-model="slider.value"> 
    {{slider.value}} 
    </span>

也许不是优雅，但我只是用旋转的CSS，使其垂直它NG重复。请注意，您必须定义一个更好的CSS选择器不是“输入”

input { 
    -ms-transform: rotate(-90deg); /* IE 9 */ 
    -webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */ 
    transform: rotate(-90deg); 
    width:70px; 
    height:100px; 
}

希望它帮助

来源

2015-06-19 15:26:20 Okazari

其他人有没有角度和范围滑块的麻烦？

回答

相关问题