From ng-repeat in <tr> not accepting parameter in custom filter

Issue

In my application I am iterating array with ng-repeat and showing values in tabuler format. Now I want to pass an custom filter which should take an argument from iterated array. I am doing it in below way:

<tr   ng-repeat="arrList in records.actualList|geneFilter:arrList.selectedArr">

'selectedArr' is an under 'actualList' and records is the parent array.

Now in my custom filter:

"use strict";
var portalApp = angular.module('filter', []);
portalApp.filter('geneFilter', function() {
    return function(input,changedArr){
        var out=[];
        var selectedArr='';
        console.log('changed Arr::'+changedArr);

        return selectedArr;

    }
});

In custom filter I am always getting changed arr value as 'undefined'.

Solution

I'm very curious about how it should work at all!

we have cyclic dependency, here. This is a reason why you get undefined

arrList.selectedArr is a result of what you return in your filter that should be return out and not return selectedArr

<tr ng-repeat="arrList in records.actualList|geneFilter:arrList.selectedArr"> 

Let's try to describe what we have:

I filter records.actualList by custom filter named geneFilter that receives as argument the result of filter - arrList, a.e. arrList.selectedArr based on filtered data

---

This is how I see it to make it work:

<tr ng-repeat="item in records.actualList|geneFilter:types">

and

portalApp.filter('geneFilter', function() {
    return function(input,someTypes){
        var out=[];

        angular.forEach(input, function(item) {
          if(someTypes == "some info") {
             out.push(item);
           }        
       });

        return out;
    }
});

• here input is actually records.actualList
• out - an array as result, returned from the filter. So you can write your own condition how to filter it

Answered By - Maxim Shoustin