I have a data representation application that displays information in table format with columns
id, name, price, quantity
The data is presented using ng-repeat. You can view it on this Plunker
<body ng-controller="myController">
<h1>Data</h1>
<table>
<tr>
<th>ID</th>
<th>NAME</th>
<th>PRICE</th>
<th>QUANTITY</th>
</tr>
<tr ng-repeat="item in myData">
<td>{{ item.id }}</td>
<td>{{ item.name }}</td>
<td>{{ item.price }}</td>
<td>{{ item.quantity }}</td>
</tr>
</table>
My goal is to implement multiple filters in the ng-repeat for this table
a) Filter by 'Name'
b) Filter by 'Price' OR 'Quantity'
This means that the table should be filtered by either
i) 'Name' and 'Price'
ii) OR 'Name' and 'Quantity'
The Quantity filter should be inactive when the Price filter is active, and vice versa.
I will provide 3 input fields for the filter parameters.
How do I implement these filters in the ng-repeat in HTML to achieve this?