AngularJS Filters Lesson 9

Introduction

When developing any application sometimes we need to format data and require filtering of data, at that point of time filters would be the good choice to implement that logic.

Filters help to format data and do filtering over the data at  HTML or JavaScript, in HTML pipe | symbol is required and to do the same in JavaScript we have to use $filter service.

Types Of Filters

AngularJs provides in-build filters as well as give the option to create our own filters.
1) Built-In filters
2) Custom Filters

Built-In Filters

1) uppercase
2) lowercase
3) number
4) date
Lets see how they can be used in formatting data in HTML.



Lets see how $filter service can be applied on JavaScript controller to achieve the same what we have seen earlier.


Some more built-in filters

5) filter : Returns new array by selecting subset of items from an existing array, it will take      string,object, or function to select or reject any subset array.

6) json: Convert JavaScript object into json string, mostly used for debugging purpose.

{{{"state":"karnataka","city":"bangalore"} | json}}

7) orderBy: For getting any array in ascending or descending order orderBy filter can be used, it order string alphabetically and numbers numerically.
It takes two parameter, first parameter decides on which column order has to be done and second parameter should be boolean value.If boolean value is true then  sort the data in reverse order.
8) limitTo :Creates a new array or string with limited numbers of elements.


9) currency : Formats number as a currency, helps to display currency symbol, default currency is currency of that locale.We v can also pass our own symbol to display.