How to filter by object's property in AngularJS?

Question

I have two array of objects as shown below:

$scope.countries = [
        {'id' : 1, 'country_name':'India'},
        {'id' : 10, 'country_name':'Australia'},
        {'id' : 2, 'country_name':'England'}
    ];
$scope.states = [
        {'state_id' : 1, 'state_name':'Delhi', 'country_id':{'id':1 ,'country_name':'India'}},
        {'state_id' : 5, 'state_name':'London', 'country_id':{'id':2 ,'country_name':'England'}},
        {'state_id' : 2, 'state_name':'Victoria', 'country_id':{'id':10 ,'country_name':'Australia'}}
    ];

I'm trying to filter the states based on the id inside the country_id object as shown below:

<select ng-model="sellerCountry" ng-options="item.id as item.country_name for item in countries" required>
    <option value="">Select Country</option>
</select>   

<select ng-model="sellerState" ng-options="item.id as item.state_name for item in states | filter : {country_id: { id : sellerCountry}, }" ng-disabled="!sellerCountry">
    <option value="">Select State</option>
</select>

Here, when i select India ( where id = 1) from the first select box, i should only get Delhi to be displayed in second select, but its displaying Delhi (country_id.id = 1) and Victoria( country_id.id = 10 )

Need help to sort out this. Thanks in advance.

Pankaj Parkar · Accepted Answer · 2017-09-07 16:31:45Z

1

By default filters do contains search, you should make that filter to do strict comparison, by passing 3rd parameter to true to filter.

 ng-options="item.id as item.state_name for item in states
               | filter : {country_id: { id : sellerCountry} }: true"

Demo Plunker

edited Sep 7, 2017 at 16:31

answered Sep 7, 2017 at 16:24

Pankaj Parkar

136k23 gold badges241 silver badges307 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to filter by object's property in AngularJS?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related