How to filter multiple dynamic values in angularJS

Question

Just like the question provider in This question, I am building a filter that filters on multiple values.

However, in my situation, I also want to have the filters created dynamically from an array.

So, for this example, instead of

<input type="checkbox" ng-model="genrefilters.action" />Action

<input type="checkbox" ng-model="genrefilters.family" />Family

I want to ng-repeat like this to create the input boxes:

<div ng-repeat="distinctgenre in distinctgenres'">
    <input type="checkbox" ng-model="genrefilters.distinctgenre"/{{distinctgenre}}
</div>

However, when I do this, my filter, which is the same as in the original question:

.filter('bygenre', function () {
return function (movies, genrefilters) {
    var items = {
        genrefilters: genrefilters,
        out: []
    };
    angular.forEach(movies, function (value, key) {
        if (this.genrefilters[value.genre] === true) {   // <=== THIS LINE ERRORS OUT
            this.out.push(value);
        }
    }, items);
    return items.out;
};

Errors out, with TypeError: Cannot read property 'Action' of undefined.

I am using the filter like so.

<tr ng-repeat="movie in displayedmovies | byCohort:genrefilters">
    {{movie}}

Any assistance would be appreciated.

Thanks to dfsq for the reminder on bracket notation. That seems to be the main issue. (I also had some other dumb naming convention issues)

dfsq · Accepted Answer · 2016-01-08 18:05:03Z

1

You should generate filter inputs using bracket notation:

<div ng-repeat="distinctgenre in distinctgenres'">
    <input type="checkbox" ng-model="genrefilters[distinctgenre]" /> {{distinctgenre}}
</div>

answered Jan 8, 2016 at 18:05

dfsq

193k26 gold badges244 silver badges261 bronze badges

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

1 Comment

Xgongiveittoya Over a year ago

Goddammit, I knew it was gonna be something dumb. I'll check it when I get back from lunch but this is probably the correct answer.

Collectives™ on Stack Overflow

How to filter multiple dynamic values in angularJS

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related