Complicated Filter - AngularJS
by Silambarasan_sundaram
HTML
<link rel="stylesheet" href="http://bootswatch.com/flatly/bootstrap.min.css">
<div ng-app="myApp" ng-controller='MainCtrl'>
Rating : <select ng-model='filterParams.rating' ng-options='i for i in ratingParams'><option value=''></option></select>
Price : <select ng-model='filterParams.price' ng-options="p.range for p in priceParams"><option value=''></option></select>
<hr /> <br>
<input type="radio" name="sex" value="Friend" ng-model='filterParams.sugg'>friend
<input type="radio" name="sex" value="Self" ng-model='filterParams.sugg'>Self
<hr />
<hr/>
<table class="table table-condensed table-striped" >
<thead>
<tr>
<th>Id</th>
<th>Type</th>
<th>Name</th>
<th>Rating</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="j in json | customFilter:filterParams">
<td>{{j.itemId}}</td>
<td>{{j.businessType}}</td>
<td>{{j.name}}</td>
<td>{{j.rating}}</td>
<td>{{j.price}}</td>
</tr>
</tbody>
</table>
</div>
JavaScript
var app = angular.module("myApp",[]);
app.controller("MainCtrl", function($scope){
$scope.priceParams = [
{range : '0-9', lower: 0, upper:9},
{range : '10-99', lower: 10, upper:999},
{range : '100-999', lower: 100, upper:999}
];
$scope.ratingParams = [1,2,3,4,5];
$scope.json = [
{
"itemId": 1062,
"businessType": "SPORT",
"name": "Modern Martial Arts Vitor Shaolin Brazilian Jiu Jitsu",
"websiteUrl": "http://www.yelp.com/biz/modern-martial-arts-vitor-shaolin-brazilian-jiu-jitsu-new-york",
"rating": 5,
"city": "New York",
"address": "780 8th Ave (b/t 47th St & 48th St) Hell's Kitchen New York NY 10036",
"imageUrl": "http://s3-media3.ak.yelpcdn.com/bphoto/JHk9p_jYX1QpQN4Im-p3jA/ms.jpg",
"source": "Yelp",
"price" : 6,
"itemType": "Business",
"suggestionCriteria": "like",
"suggestedBy": "Self",
"suggestingUser": {
"userId": 1,
"firstName": "Gaurav",
"lastName": "Shandilya",
"imageUrl": "http://54.243.29.6:8080/UploadedImages/1_1401692790212_Ashish"
}
},
{
"itemId": 8227,
"businessType": "SPORT",
"name": "TGA of Bergen County",
"websiteUrl": "http://www.golftga.com/Default.aspx?alias=www.golftga.com/bergencounty",
"city": "Wayne",
"address": "17 North Jersey Lane Wayne NJ 07470 USA",
"source": "Groupon",
"price" :26,
"itemType": "Business",
"suggestionCriteria": "like",
"suggestedBy": "Self",
"suggestingUser": {
"userId": 1,
"firstName": "Gaurav",
"lastName": "Shandilya",
"imageUrl": "http://54.243.29.6:8080/UploadedImages/1_1401692790212_Ashish"
}
},
{
"itemId": 3932,
"businessType": "SPORT",
"name": "Willowbrook Golf Center",
"websiteUrl":...