How to make angularjs filter work only once?

Question

I have this filter:

filter:{ ClientId:details.client.Id }

Here how I use It:

  <uib-accordion-group ng-repeat="contract in details.contracts | filter:{ ClientId:details.client.Id } " is-open="false">
            <uib-accordion-heading>
                <div class="text-center">
                </div>
            </uib-accordion-heading>
            <div class="form-group">
                bla bla
            </div>
        </uib-accordion-group>
</uib-accordion>

How can I make filter work only once when uib-accordion derective is created?

It's a bit unclear what you mean. The purpose of a filter in an ng-repeat is to be run for each item in the list of items passed. — Heretic Monkey
– Heretic Monkey, Commented Aug 30, 2016 at 17:41

Petr Averyanov · Accepted Answer · 2016-08-30 17:31:42Z

2

You can use contract in ::details.contracts | filter:{ ClientId:details.client.Id }. This will evaluates whole expression once (ok, not once, until it becomes defined). But it also wont update expression when details.contracts changes.

answered Aug 30, 2016 at 17:31

Petr Averyanov

9,5963 gold badges25 silver badges41 bronze badges

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

Comments

Community · Accepted Answer · 2020-06-20 09:12:55Z

Per the documentation

When filters are executed

In templates, filters are only executed when their inputs have changed. This is more performant than executing a filter on each $digest as is the case with expressions.

There are two exceptions to this rule:

In general, this applies only to filters that take primitive values as inputs. Filters that receive Objects as input are executed on each $digest, as it would be too costly to track if the inputs have changed.

Filters that are marked as $stateful are also executed on each $digest. See Stateful filters for more information. Note that no Angular core filters are $stateful.

So in your case, so long as details.client.Id isn't triggered from some input's change event or isn't triggering a digest, your filter is running as performant as it can be.

Another way would be to call a controller method that has a cached value. It won't prevent the filter from firing, but it will immediately return a cached value. I don't recommend this though because angular filters are generally the prescribed solution for performant filtering solutions.

controller method

$scope.getCached = function(){
    if(cachedValue) return cachedValue
    return cachedValue = ...
}

implementation

<div ng-repeat="obj in objs | filter:getCached()">

Collectives™ on Stack Overflow

How to make angularjs filter work only once?

2 Answers 2

Comments

When filters are executed

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

When filters are executed

Comments

Your Answer

Sign up or log in

Post as a guest

Related