从angularJS

时间:2016-02-20 18:35:48

标签: angularjs input range

我正在使用范围输入,但需要在step min,maxvalueng-repeat >

<div ng-repeat="paramObj in activeExercise.Params track by $index">
    <div class="item item-divider">
        {{paramObj.param}}: {{paramObj.childParam || 0}}
    </div>
    <div ng-if="checkRangeItems(paramObj)" class="item range">
        <i class="icon orange" ng-class="paramClass(paramObj.param)"></i>
        <input type="range" name="parameter" ng-model="paramObj.childParam" min="0" step="{{paramObj.paramStep}}" max="" value="0">
    </div>
</div>

我的数据对象的一个​​例子是:

[{"param":"Sets"},{"param":"Reps"},{"param":"Weight"},{"param":"Color"},{"param":"Time (Sec)"},{"param":"Time (Min)"},{"param":"Hold"},{"param":"Tempo"}]

我需要根据param.param的值设置范围值。

喜欢 这个:

$scope.getVars = function(paramObj) {

    switch (paramObj.param) {
        case "Sets":
            return {max: 90, min: 0, step: 10};
            break;

        case "Reps":
            return {max: 90, min: 0, step: 10};
            break;
    }
}

这可能吗?

1 个答案:

答案 0 :(得分:1)

是的,这是可能的!

&#13;
&#13;
// Code goes here
var app = angular.module('app', []);

app.controller('indexCtrl', function ($scope) {
  $scope.title = 'HTML5 - Range';
  $scope.min = 0;
  $scope.max = 50;
  $scope.step = 10;
  $scope.value = 20;
});
&#13;
<!DOCTYPE html>
<html ng-app="app">

  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
    <script src="script.js"></script>
  </head>

  <body ng-controller="indexCtrl">
    <h2>{{title}}</h2>
    Min: <input type="text" ng-model="min"><br/>
    Max: <input type="text" ng-model="max"><br/>
    Step: <input type="text" ng-model="step"><br/>
     Value:<input type="text" ng-model="value"><br/>
    <input type="range" ng-model="value" name="points" min="{{min}}" max="{{max}}" step="{{step}}" />
    
  </body>

</html>
&#13;
&#13;
&#13;