Angular limitTo with condition

Question

I am using a angularjs filter method on an repeated array of items and trying to filter numbers with a limitTo filter.

This is my JsFiddle code

The filter is working fine but I have a condition ng-if="!o.IsFeaturedEvent" and filter should apply to the event list which is not IsFeaturedEvent. Currently it is applying on all the events

How can I use limitto with ng-if condition

Any suggestion or help would be appreciated.

Thanks in advance

Answer 1

You need to create a custom filter like this:

.filter('nonFeaturedEvent', function() {
  return events => events.filter(e => !e.IsFeaturedEvent);
})

And apply it before your limit to, like this:

<div ng-repeat="o in data  | nonFeaturedEvent | limitTo:limit"  ng-if="!o.IsFeaturedEvent">

The nonFeaturedEvent filter will remove all featured events before passing to the limitTo filter.

Here's a link to the fiddle for this idea. It's a bit of a simplification.

Answer 2

Don't use ng-if, use filter to do it.

I tested your code with "o in data | filter: !o.IsFeaturedEvent | limitTo:limit "

It displays the first event, which is a featured event.

If you want to display non-featured events, then use

"o in data | filter: o.IsFeaturedEvent | limitTo:limit "