Angular: Empty Fiddle
http://angularjs.org/
HTML
<script src="http://code.angularjs.org/angular-1.0.1.js"></script>
<div ng-controller="MyController">
<input type="text" ng-model="selectedCityId" />
<ul>
<li ng-repeat="shop in shops | filter:search">
{{ shop }}
</li>
</ul>
</div>
JavaScript
var myApp = angular.module('myApp', []);
myApp.controller('MyController', function ($scope) {
$scope.search = function (shop) {
if ($scope.selectedCityId === undefined || $scope.selectedCityId.length === 0) {
return true;
}
var found = false;
angular.forEach(shop.locations, function (location) {
if (location.city_id === parseInt($scope.selectedCityId)) {
found = true;
}
});
return found;
};
$scope.shops =
[
{
"category_id":2,
"locations":[
{
"city_id":368
}
]
},
{
"name":"xxx",
"category_id":1,
"locations":[
{
"city_id":368,
"region_id":4
},
{
"city_id":368,
"region_id":4
},
{
"city_id":368,
"region_id":4
}
]
},
{
"name":"xxx",
"category_id":2,
"locations":[
{
"city_id":30,
"region_id":4
},
{
"city_id":22,
"region_id":2
}
]
}
];
});