---
Title: Task Filters component
Added: v2.0.0
Status: Active
Last reviewed: 2018-11-16
---
# [Task Filters component](../../lib/process-services/task-list/components/task-filters.component.ts "Defined in task-filters.component.ts")
Shows all available filters.
## Basic Usage
```html
```
## Class members
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| appId | `number` | | Display filters available to the current user for the application with the specified ID. |
| appName | `string` | | Display filters available to the current user for the application with the specified name. |
| filterParam | [`FilterParamsModel`](../../lib/process-services/task-list/models/filter.model.ts) | | Parameters to use for the task filter. If there is no match then the default filter (the first one the list) is selected. |
| showIcon | `boolean` | | Toggles display of the filter's icon. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`` | Emitted when an error occurs during loading. |
| filterClick | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FilterRepresentationModel`](../../lib/process-services/task-list/models/filter.model.ts)`>` | Emitted when a filter in the list is clicked. |
| success | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`` | Emitted when the list is loaded. |
## Details
### Filtering APS task filters
Use the `filterParam` property to restrict the range of filters that are shown:
```html
```
You can use properties from [`FilterParamsModel`](../../lib/process-services/task-list/models/filter.model.ts)
as the value of `filterParam` as shown in the table below:
| Name | Type | Description |
| ---- | ---- | ----------- |
| id | string | The id of the task filter |
| name | string | The name of the task filter, lowercase is checked |
| index | string | The zero-based position of the filter in the array. |