---
title: "What are filters in AngularJS?"  
description: "What are filters in AngularJS?"  
author: "Sandra Emily"  
published: 2024-06-24  
updated: 2024-06-24  
canonical: https://www.mindstick.com/forum/160772/what-are-filters-in-angularjs  
category: "angular js"  
tags: ["web development", "angular js", "front-end development"]  
reading_time: 2 minutes  

---

# What are filters in AngularJS?

What are filters in AngularJS?

## Replies

### Reply by Ravi Vishwakarma

[Filters in AngularJS](https://www.mindstick.com/blog/304416/filters-in-angularjs) are used to format the value of an expression for display to the user. They can be applied in **view templates**, **controllers**, or **services**, and they allow you to transform data in various ways. Filters are particularly useful for tasks such as formatting **dates**, **currency**, **filtering arrays**, and **modifying strings**.

In the angularJs filter are two types

1. **Built-in Filters**
2. **Custom Filters**

[**Built-in Filters**](https://www.mindstick.com/blog/304416/filters-in-angularjs)

AngularJS provides several built-in filters, including:

1. **currency**: Formats a number as a currency (e.g., `$1,234.56`).
2. **date**: Formats a date to a specified format.
3. **filter**: Selects a subset of items from an array.
4. **json**: Formats an object as a JSON string.
5. **limitTo**: Limits the array or string to a specified number of elements or characters.
6. **lowercase**: Converts a string to lowercase.
7. **number**: Formats a number as a text string.
8. **orderBy**: Orders an array by an expression.
9. **uppercase**: Converts a string to uppercase.

```javascript
currency Filter:
<p>{{ amount | currency }}</p>
<!-- If amount is 1234.56, this will display $1,234.56 -->

date Filter:
<p>{{ today | date:'fullDate' }}</p>
<!-- If today is a Date object, this will display the full date format, e.g., Monday, April 1, 2024 -->

uppercase Filter:
<p>{{ message | uppercase }}</p>
<!-- If message is "hello", this will display HELLO -->
```

[**Custom filter**](https://www.mindstick.com/blog/304399/custom-filters-in-angularjs)

In AngularJS, **custom filters** are used to set the value of an expression to be displayed to the user.

```javascript
app.filter('reverse', function() {
    return function(input) {
        if (!input) return '';
        return input.split('').reverse().join('');
    };
});
```

## Use them

```html
<p>{{ message | reverse }}</p>
<!-- If message is "hello", this will display "olleh" -->
```

## Read more

[Filters in AngularJS](https://www.mindstick.com/blog/304416/filters-in-angularjs)

[Custom Filters in AngularJS](https://www.mindstick.com/blog/304399/custom-filters-in-angularjs)

[What is a Filter and how to use it in AngularJS, Explain with an Example.](https://www.mindstick.com/articles/335818/what-is-a-filter-and-how-to-use-it-in-angularjs-explain-with-an-example)


---

Original Source: https://www.mindstick.com/forum/160772/what-are-filters-in-angularjs

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.
