CODEWITHSUNDEEP
javascriptangularjs
David Kovac
David Kovac

Reputation: 11

Same filter for ng-repeat inside another ng-repeat

Same filter for ng-repeat inside another ng-repeat

I make a table where I need to combinate col from different array's. The first array is the list of same data. The first col is number, when this number is empty, I get another number from second array. Then a I have search box and for searching I using just this number from the first col. I using ng-model for filter in table, but I can't this filter for both ng-repeat.

search box

<div calss="input-lg">
    <input name="value" id="input" type="text" class="input-lg"  
    placeholder="Search in DM-TEC" ng-model="searchDM" ng-virtual-keyboard="
   {size: 9, relative: false}"/>
</div>

html table

 <tbody ng-repeat="roll in vykresy | filter: searchDM">
     <tr  ng-repeat="re in RE | filter: searchDM" ng-if="roll.id === 'RE'">
     <td> {{re.num}}</td>
     <td> {{roll.name}} </td>
     <td rowspan="{{RE.length}}" ng-if="$index===0" style="vertical-align: middle;"> {{roll.numberD}} </td>
     <td rowspan="{{RE.length}}" ng-if="$index===0" style="vertical-align: middle;"> <a ng-href=" ./pdf/{{roll.numberD}}.pdf">{{roll.numberD}}.pdf</a> </td>                 
     </tr>  


     <tr ng-repeat="rel in REL | filter: searchDM" ng-if=" roll.id === 'REL'">   
     <td> {{rel.numberPN}}  </td>
     <td> {{roll.name}} </td>
     <td rowspan="{{REL.length}}" ng-if="$index===0" style="vertical-align: middle;"> {{roll.numberD}} </td>
     <td rowspan="{{REL.length}}" ng-if="$index===0" style="vertical-align: middle;"> <a ng-href=" ./pdf/{{roll.numberD}}.pdf">{{roll.numberD}}.pdf</a> </td>                 
     </tr> 

     <tr ng-repeat="re_l in RE_L | filter: searchDM" ng-if=" roll.id === 'RE_L'">   
     <td> {{re_l.numberPN}}  </td>
     <td> {{roll.name}} </td>
     <td rowspan="{{RE_L.length}}" ng-if="$index===0" style="vertical-align: middle;"> {{roll.numberD}} </td>
     <td rowspan="{{RE_L.length}}" ng-if="$index===0" style="vertical-align: middle;"> <a ng-href=" ./pdf/{{roll.numberD}}.pdf">{{roll.numberD}}.pdf</a> </td>                 
     </tr> 

     <tr ng-if="roll.id === 'PVR'">  
     <td> {{roll.numberPN}}  </td>
     <td> {{roll.name}} </td>
     <td> {{roll.numberD}} </td>
     <td> <a ng-href=" ./pdf/{{roll.numberD}}.pdf">{{roll.numberD}}.pdf</a> </td>
     </tr>

angular

$scope.search = '';

The filter work just only tbody ng-repeat or just inside, but I need use this filter for both.

Thanks in advance!

Best regards David

Upvotes: 1

Views: 189

Answers (1)

RIYAJ KHAN
RIYAJ KHAN

Reputation: 15292

You are using common ng-model on both filter.

As result ,

ng-repeat="roll in vykresy | filter: searchDM"

If the tbody is getting hidden because of the filter result, your inner filter has no chance to show the result.

The result inner ng-repeat of which is inner DOM will automatically get removed.So,you can not see it.

Upvotes: 1

Related Questions