Reputation: 1387
What am I doing wrong here? I'm following the exact format as stated on AngularJS
<div ng-repeat="country in (config.countries | filter:'Canada')">
{{country.name}}
</div>
I've also tried
<div ng-repeat="country in (config.countries| filter:{name:'Canada'})">
{{country.name}}
</div>
Neither of these actually filter my results.
Thanks for the help
UPDATE
json structure
"countries":{
"Azerbaijan":{"name": "Azerbaijan", "code": "AZ","currency" :"AZN"},
"Bahamas":{"name": "Bahamas", "code": "BS","currency" :"BSD"},
"Bahrain":{"name": "Bahrain", "code": "BH","currency" :"BHD"},
"Bangladesh":{"name": "Bangladesh", "code": "BD","currency" :"BDT"},
Upvotes: 1
Views: 265
Reputation: 17299
your filter must be similar this.
function Main($scope) {
$scope.countries = {
"Azerbaijan":{"name": "Azerbaijan", "code": "AZ","currency" :"AZN"},
"Bahamas":{"name": "Bahamas", "code": "BS","currency" :"BSD"},
"Bahrain":{"name": "Bahrain", "code": "BH","currency" :"BHD"},
"Bangladesh":{"name": "Bangladesh", "code": "BD","currency" :"BDT"}
};
$scope.myFilter = function(countries,filter) {
var result = {};
angular.forEach(countries, function(value,key) {
if (value.name == filter) {
result[key] = value;
}
});
return result;
}
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app>
<div ng-controller="Main">
<ul>
<li ng-repeat="(key,value) in myFilter(countries,'Azerbaijan')">
{{value.name}}
</li>
</ul>
</div>
</div>
Upvotes: 1
Reputation: 749
Could you please show us the structure/data of config.countries
? I tried your second snippet with
$scope.config = {}; $scope.config.countries = [{"name": "Canada"}, {"name": "England"}];
and it´s working fine.
Upvotes: 0