Use the below code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js"></script>
<script type="text/javascript">
var app_data = {
price_filters: [{
"value": 100000,
"section": 1
}, {
"value": 250000,
"section": 1
}, {
"value": 500000,
"section": 1
}, {
"value": 750000,
"section": 1
}, {
"value": 1000000,
"section": 1
}, {
"value": 2000000,
"section": 1
}, {
"value": 5000000,
"section": 1
}, {
"value": 500,
"section": 2
}, {
"value": 1000,
"section": 2
}, {
"value": 2000,
"section": 2
}, {
"value": 3000,
"section": 2
}, {
"value": 4000,
"section": 2
}, {
"value": 6000,
"section": 2
}, {
"value": 10000,
"section": 2
}, {
"value": 20000,
"section": 2
}, {
"value": 50000,
"section": 2
}, ]
};
var app = angular.module('App', []);
var arr = app_data.price_filters;
app.controller('MainCtrl', function ($scope) {
$scope.mins = [];
$scope.maxs = [];
$scope.getMxRange = function () {
var priceArr = [];
if ($scope.minVal) {
angular.forEach($scope.maxs, function (maxVal) {
if ($scope.minVal < maxVal) {
this.push(maxVal);
}
}, priceArr);
}
else {
priceArr = $scope.maxs;
}
return priceArr;
};
$scope.$watch('sectionSelect', function () {
var newArr = [];
if ($scope.sectionSelect == 1) {
for ($i = 0; $i < arr.length; $i++) {
if (arr[$i]['section'] === 1) {
newArr.push(arr[$i]['value']);
}
}
}
else if ($scope.sectionSelect == 2) {
for ($i = 0; $i < arr.length; $i++) {
if (arr[$i]['section'] === 2) {
newArr.push(arr[$i]['value']);
}
}
}
$scope.mins = newArr;
$scope.maxs = newArr;
});
});
</script>
</head>
<body ng-app="App">
<div ng-controller="MainCtrl">
<form action="#">
<select ng-model="sectionSelect" ng-init="sectionSelect = 1">
<option value="11">11</option>
<option value="1">For Sale</option>
<option value="2">For Rent</option>
</select>
<select ng-model="minVal">
<option ng-repeat="min in mins" value="{{min}}">{{min}}</option>
</select>
<select>
<option ng-repeat="max in getMxRange()" value="{{max}}">{{max}}</option>
</select>
</form>
</div>
</body>
</html>