how to use custom filter in angularjs

Question

`In my code iam using custom filter for filtering gender(male,female). but in my output when i click male it does not filter,but when i click female it shows filtered output consisting of only females. I dont know where is my mistake.

app.filter('myFilter', function () {
    return function (items, filterby) {
        var filtered    = [];
        var filtermatch = new RegExp(filterby, 'i');

        for (var i = 0; i < items.length; i++) {

            if (filtermatch.test(items[i].gender) {
                filtered.push(items[i]);
            }
         }

         return filtered;
    };
});

<ul id="result">
    <li ng-repeat="x in details | myFilter:filterby">
        <div>Name:    {{x.name   }}</div>
        <div>Address: {{x.address}}</div>
        <div>Gender:  {{x.gender }}</div>
        <div>Country: {{x.country}}</div>
        <div>Agree:   {{x.agree  }}</div>
    </li>
</ul>

And this is my code for radio buttons male and female

<div class="form-group">

<label for="filterby" class="control-label col-xs-2">Filter By Gender</label>
    <div class="radio">

        <label>

            <input type="radio" name="options" id="options2" 
            ng-model="filterby" value="female">
            <label for="gender" class="control-label col-xs-2">Female</label>
        </label>

        <label>
            <input type="radio" name="options" id="options2" 
            ng-model="filterby" value="male">
            <label for="gender" class="control-label col-xs-2">male</label>
        </label>
    </div>
        </div>

This answer may help you: stackoverflow.com/questions/15196161/… — akn
– akn, Commented Aug 8, 2014 at 11:50
@RahilWazir: Why do you say the filter declaration is wrong ? — gkalpak
– gkalpak, Commented Aug 9, 2014 at 7:25
@ExpertSystem Because this stackoverflow.com/revisions/25202584/1 is not correct way to create filters. — Rahil Wazir
– Rahil Wazir, Commented Aug 9, 2014 at 12:02

gkalpak · Accepted Answer · 2014-08-11 08:58:31Z

1

Apart from the fact that you are not using the sort argument, if you want to pass multiple parameters to a filter you separate them with :.

ng-repeat="x in details | myFilter:prop1:prop2">

This will call myFilter(details, prop1, prop2) and ngRepeat over the returned array.

edited Aug 11, 2014 at 8:58

answered Aug 9, 2014 at 7:27

gkalpak

48.2k8 gold badges108 silver badges120 bronze badges

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

Comments

theJoi · Accepted Answer · 2016-08-07 19:41:19Z

1

It is probably filtering correctly. The problem is the search term "male" will include both "female" and "male" because you can find the term "male" in female. Just use not female instead (i.e. !female).

answered Aug 7, 2016 at 19:41

theJoi

4035 silver badges10 bronze badges

Collectives™ on Stack Overflow

how to use custom filter in angularjs

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related