Multi checkbox filter not working in ng-repeat with AngularJS

Question

I have several age range filters done in my AngularJS app. Of the 4 of them, one doesn't work properly (results don't match the filter), and I can't seem to find why.

You can see a working example here.

The filters look like this:

.filter('five', function () {
  return function ( items,filter) {
      if(filter)return items.filter(x=>x.age<=4);
      else return items;
  }
})

.filter('child', function () {
  return function ( items,filter) {
      if(filter)return (items.filter(x=>x.age>=5) && items.filter(x=>x.age<=14));
      else return items;
  }
})


.filter('young', function () {
  return function ( items,filter) {
      if(filter)return (items.filter(x=>x.age>=14) && items.filter(x=>x.age<=17));
      else return items;
  }
})


.filter('adult', function () {
  return function ( items,filter) {
      if(filter)return items.filter(x=>x.age>=18);
      else return items;
  }
})

And in the view I do this:

<div ng-repeat="item in data 
    | five:fiveFilter 
    | adult:adultFilter 
    | young:youngFilter 
    | child:childFilter">
 {{item.age}}
</div>

As you will see, all filters work except the young one.

What am I missing?

(young ones don't work, because child labour is illegal) Your items.filter would return a subset of $scope.data array, you can't do && on both arrays like that. For example: [1,2,3]&&[2,3,4] will return [2,3,4] — Aleksey Solovey
– Aleksey Solovey, Commented Feb 2, 2018 at 15:38

Igor Dimchevski · Accepted Answer · 2018-02-02 16:03:05Z

1

Change these filters code:

.filter('child', function () {
  return function ( items,filter) {
      if(filter)return (items.filter(x=>x.age>=5 && x.age<=14));
      else return items;
  }
})


.filter('young', function () {
  return function ( items,filter) {
      if(filter)return (items.filter(x=>x.age>=14 && x.age<=17));
      else return items;
  }
})

answered Feb 2, 2018 at 16:03

Igor Dimchevski

4524 silver badges13 bronze badges

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

Collectives™ on Stack Overflow

Multi checkbox filter not working in ng-repeat with 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