用过滤器更新ng-repeat

Question

I have some angular code that I am working with and hopefully soon refactoring.
I am trying to filter through a ng-repeat based off of a checkbox.

I have a data tree that looks like so ...

{
    name: 'mail',
    rating: 2.4,
    source: 'EDD',
    users: 1000,
    description: ''
}

The ng-repeat work is set up to iterate through

<li ng-repeat="rule in property">{{rule[entityPropertyName]}</li>

The property was renamed off of a products service that exists in the searchController like so

HTML

<search-section productName="qualifier" 
                product="qualifiers" 
                entityPropertyName="name"></search-section>

Directive

controller: 'searchController',
scope: {
    product: '=',
    productName: '@',
    entityPropertyName: '@'
},

I am filtering through the checkbox with a simple function in the controller

$scope.filterAdded = function(sourceName) {
    if($scope.filteredQualifiers.sourceName[sourceName]) {
        return sourceName;
    }
}  // returns source name 

The source name is returned ex: media , or age .

I was hopeful that I could add

$scope.filterAdded 

to the ng-repeat iterator like so

<li ng-repeat="rule in property | filter: filterAdded">{{rule[entityPropertyName]}</li>

This filter would be supported from the directive like so

scope: {
    entities: '=',
    entityName: '@',
    entityPropertyName: '@',
    filterAdded: '&'
},

With filterAdded being seen as a function.

With filter added returning a single value like EDD

I identified that I that I would need to filter through the rule source.

source: 'EDD'

Not seeing a way that I could compare get rule.source and the filterAdded value.

<li ng-repeat="rule in property | filter: filterAdded"></li> 

Any insight or feedback is appreciated.

Answer 1

I'm into Angular 4, so I will use this language but you can adapt to angular js (1.x).

If I got it right, would use the ngFor or ngRepeat with the ngIf instead of using pipes.

<ul *ngFor=" let rule in property">

*note that the ngFor would be used for the ul, not the li.

Then, on li tag I would use the ngIf to check if it is under a certain filter. On the ngIf you can bind to a function and even pass properties of the object or items of the array you are iterating like:

<li *ngIf="isThisOnFilter(rule['rating'])">{{ rule['name'] }}</li>

Hope it helps.