Programming Examples
Angular JS program to change the size of circle using range bar
Write Angular JS program to change the size of circle using input type range
Solution
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<style>
.circle
{
width:300px;
height:300px;
background:red;
border-radius:50%;
}
</style>
<body>
<div ng-app="">
100<input type="range" min="100" max="500" step="50" ng-model="size"/>{{size}}<br/>
<br/>
<br/>
<div class="circle" style="width:{{size}}px;height:{{size}}px"></<div>
</div>
</body>
</html>