Today we will learn about AngularJS's built-in filters
Let’s take a look at how these built-in filters are used:
A filter without parameters
{{expression | filter}}
A filter with parameters
{{expression | filter:arguments}}
A filter with multiple parameters
{{expression | filter: arg1: arg2: ...}}
Multiple filters without parameters
{{expression | filter1 | filter2 | ...}}
Below we use the following built-in filters for AngularJS
currency
currency allows us to set our own currency symbol, which will be used by default in the area where the client is located.
Can be used like this: {{ 3600 | currency: "$￥"}}
The return result is $￥123.00
Online code click preview
number
The number filter formats the number into text. Its parameters are optional and are used to control the number of intercepted digits after the decimal point.
If the passed in is a non-numeric character, an empty string will be returned
Can be used like this: {{ 3600 | number:2}}
The return result is: 3,600.00
Online code click preview
lowercase
lowercase converts string to lowercase
You can use it like this: {{ "HEllo" | lowercase}}
The return result is: hello
Online code click preview
uppercase
uppercase converts string to uppercase
Can be used like this: {{ "HEllo" | uppercase}}
The return result is: HELLO
Online code click preview
json
The json filter can convert a JSON or JavaScript object into a string.
This filter is very useful for debugging
You can use it like this: {{ {"name":"dreamapple","language":"AngularJS"} | json}}
The return result is: { "name": "dreamapple", "language": "AngularJS" }
Online code click preview
date
The date filter filters the date into the format you want, which is really a good filter.
There are many usages of this filter. I will list a few commonly used ones here.
{{ today | date: "yyyy - mm - dd"}}
The result is: 2015 - 15 - 13
{{ today | date: "yyyy - mm - dd HH:mm::ss"}}
The result is: 2015 - 18 - 13 20:18::38
[online code](2015 - 18 - 13 20:18::38)
There are also three built-in filters, but the use is a little more complicated. Let's discuss it together in the next article.
The above is the entire content of this article, I hope you like it.