I want to be able to filter my table with many parameters passed in as an array. Therefore I can build up an array of filter params and pass them in. I don't want to explicitly state what columns to filter against as there could be many columns (some which will be shown and some not).
The HTML looks something like this;
<tr ng-repeat="item in infoData | filter:['param1','param2']">
<td>{{item.data1}}</td>
<td>{{item.data2}}</td>
<td>{{item.data3}}</td>
<td>{{item.data4}}</td>
</tr>
Is there away to filter a table against multiple parameters?
Thanks
Using filters in view templates Filters can be applied to the result of another filter. This is called "chaining" and uses the following syntax: {{ expression | filter1 | filter2 | ... }} E.g. the markup {{ 1234 | number:2 }} formats the number 1234 with 2 decimal points using the number filter.
Using the filter filter you won't be able to pass in a parameter but there are at least two things you can do. 1) Set the data you want to filter by in a scope variable and reference that in your filter function like this fiddle. 2) Create a new filter that takes in a parameter like this fiddle.
Introduction to AngularJS Custom Filter. In AngularJS filters are used to modify or update the data before rendering the data on view or UI. Filters are clubbed in expression or directives using pipe (|) symbol.
In AngularJS when you are using ng-options, you can filter out the options by calling a custom function you have in the controller. Let's say you have following set of employees and when you display all these employees inside HTML select using ng-options, you can see all the employees in a dropdown.
This is the quick and dirty way to accomplish what you need.
First create a custom filter in the controller something like this:
$scope.customFilter = function(param1, param2) {
return function(item) {
//return custom stuff here
}
}
then in the html you do this
<tr ng-repeat="item in infoData | filter:customFilter(param1, param2)">
<td>{{item.data1}}</td>
<td>{{item.data2}}</td>
<td>{{item.data3}}</td>
<td>{{item.data4}}</td>
</tr>
this is an example with a custom filter
app.filter('customFilter', function (param1, param2) {
return function (item) {
//return custom stuff here
};
});
and now in the html you do this:
<tr ng-repeat="item in infoData | customFilter(param1, param2)">
<td>{{item.data1}}</td>
<td>{{item.data2}}</td>
<td>{{item.data3}}</td>
<td>{{item.data4}}</td>
</tr>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With