How to use two filters in Angular JS?

Question

I have input field:

<input type="text" ng-model="in">

Also select list:

<select ng-model="sel"></select>

How I can use two filters in ng-repeat something like:

ng-repeat="item in arr | filter:sel | filter:in"

My select list in header:

<div ng-controller="TestController">
   <select ng-controller="in"></select>
</div>

Also in bottom of page I have:

<div ng-controller="TestController">{{in}}</div>

But {{in}} is empty

Answer 1

You're doing right. The following can be taken as an example to apply filter. You can modify it to apply multiple filters as well.

Search field

<input type="text" ng-model="in" placeholder="Enter value to search.">
<select ng-model="sel">
<option value="1">One</option>
<option value="2">Two</option>
</select>

Using filter in ng-repeat:

<div>    
<tr ng-repeat="item in filteredData = (arr | filter:in | filter: sel)">
</div>

or simple way for multiple filters like as per your question

<tr ng-repeat="item in arr| filter:in | filter: sel">

Then showing message whether data found or not.

<div ng-show="!(filteredData ).length">
    No matching data found
</div>