5

I would like to know what is the most elegant and simple way to implement this. I need to add a filter expression for a ng-repeat that would filter 2 conditions from one property.

In this example http://plnkr.co/edit/OMQxXvSjtuudMRGE4eZ8?p=preview

  • If you enter A, it would display checkbox for A,
  • enter B - display checkbox for B.

But I want to display the specified checkboxes plus anything with empty condition. There is no condition for C, so:

  • if you enter A, I want to display both A and C checkboxes,
  • enter B, I want to display both B and C checkboxes.
Improve this question

4 Answers 4

Reset to default
8

I would create custom filter like:

app.filter('myfilter', function() {
   return function( items, condition) {
    var filtered = [];

    if(condition === undefined || condition === ''){
      return items;
    }

    angular.forEach(items, function(item) {          
       if(condition === item.condition ||  item.condition === ''){
         filtered.push(item);
       }
    });

    return filtered;
  };
});

and usage:

<span ng-repeat="charge in charges  |  myfilter:level.condition">

See Demo in Plunker

It looks pretty elegant and clear.

Hope it will help

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

Comments

8

I think you can do this pretty easily with just a filter expression function on your scope like this;

$scope.filterExpression = function(charge) {
  return (!$scope.level || !charge.condition || 
          ($scope.level.condition.toUpperCase() === charge.condition.toUpperCase()));
}

and call it like this;

<span ng-repeat="charge in charges | filter:filterExpression">

plunkr (corrected)

Improve this answer

6 Comments

this filter will work but keep in mind that it will be hard for debugging.
How so? It has the advantage of keeping the code related to the model with the controller.
I talk on style you implemented the filter. Anyways I think its good practice to write filters as separate module,
I don't disagree in principle, but I think it depends on how generic or reusable that filter might be. This implementation is clearly coupled to model used in the controller so my preference would be to keep the code contained as a method on the controller.
I agree writing filter as separate module is good practice, but I really want to know the 'simple' way, meaning the least amount of code when I am not worried about reusability.
|
3

you can use : data-ng-repeat="charge in charges | filter:searchText" data-ng-if="filter = searchText.Name"

Improve this answer

1 Comment

Now, here is some magic that you don't see every day! Thanks.
-3

Use two ng-repeats, one after another:

1st : Filter on anything that has checkbox checked AND has a condition

2nd : Filter on things that don't have conditions

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.