forum

home / developersection / forums / what are filters in angularjs?

Ask Question
Sandra Emily

Student

Content writing is the process of writing, editing, and publishing content in a digital format. That content can include blog posts, video or podcast scripts, ebooks or whitepapers, press releases, product category descriptions, landing page or social media copy and more.

Follow
Can you answer this question?
Answer

1 Answers

Ravi Vishwakarma

Ravi Vishwakarma

24-Jun-2024

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

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.
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 

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

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

Use them 

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

 

Read more 

Filters in AngularJS

Custom Filters in AngularJS

What is a Filter and how to use it in AngularJS, Explain with an Example.

advertising
advertising

Liked By

We use cookies to ensure you have the best browsing experience on our website. By using our site, you acknowledge that you have read and understood our Cookie Policy & Privacy Policy