AngularJS Tutorial - Bind to range input








The following code shows how to Bind to range input.

Example


<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.js"></script>
<script type='text/javascript'>
window.onload=function(){<!--from  ww w.  j  a  v  a2s  .  co  m-->
    document.getElementById('rangeInput').focus()
}
</script>
</head>
<body>
  <body ng-app ng-init="model.range = 50">
    <p>
    Press up and down on the keyboard.
    The slider thumb changes position,
    but the expression does not re-evaluate.
    </p>
    <input id="rangeInput" type="range" ng-model="model.range" min="1" max="100">
    {{model.range}}
</body>
</body>
</html>

The code above is rendered as follows: