AngularJS (vi)--Filter

filters are used to format data that needs to be presented to the user. Angularjs has a lot of practical built-in filters, and also provides a convenient way to create filters on your own. the filter is called through the | symbol within the template binding symbol {{}} in HTML. the string Convert to uppercase: {{name | uppercase}}built-in filters: 1. Currencythe Currecy filter can format a numeric value as a currency format. Use {{123 | currency}} to convert 123 to currency format.
2. Datethe date filter formats the dates into the format you want. Several date formats are built into the ANGULARJS, and if no format is specified, the default is mediumdate format, which is shown in the example below. The following is a built-in support for localized date formats:

<span style= "FONT-SIZE:18PX;" >{{Today | Date: ' Medium '} <!--, 12:09:02 PM-->{{Today | Date: ' Short '}} <!--8/9/1312:09pm--  >{{Today | Date: ' fulldate '} <!--Thursday, August,-->{{today | Date: ' Longdate '}} <!--August 09, -->{{Today | Date: ' mediumdate '}}<!---->{{today | Date: ' ShortDate '}} <!--8/9/13-- {{Today | date: ' mediumtime '}}<!--12:09:02 pm-->{{Today | Date: ' Shorttime '}} <!--12:09 PM--></SPAN&G T

Year formatting

<span style= "FONT-SIZE:18PX;" > Four-bit year: {{today | date: ' YYYY '}} <!----two-bit year: {{today | date: ' YY '}} <!-----one year: {{today | date: ' Y '} <!----></span>

Month formatting

<span style= "FONT-SIZE:18PX;" > English Month: {today | date: ' MMMM '}} <!--August--English month abbreviation: {{today | date: ' MMM '}} <!------------------# {Today |d Ate: ' MM '} <!----the month ordinal of the year: {{today |date: ' M '}} <!--8--></span>

date Formatting

<span style= "FONT-SIZE:18PX;" > Number Date: {{today|date: ' dd '} <!---day of one months: {{today | date: ' d '}} <!--9--and English week: {{today | date: ' EEEE '}} <!--Thursday--English week: {{today | date: ' EEE '}} <!--Thu--></span>

Hour formatting

<span style= "FONT-SIZE:18PX;" >24 Hours: {{today|date: ' HH '} <!--00--> hours of the day: {{today|date: ' H '}} <!--0-->12 Hour-hours: {{today| Date: ' hh '} <!--12--> hours of the morning or afternoon: {{today|date: ' H '}} <!--12--></span>

minute formatting

<span style= "FONT-SIZE:18PX;" > Number of minutes: {{Today | date: ' mm '}} <!-----one hours in minutes: {{Today | date: ' m '}} <!--9--></span>

number of seconds to format

<span style= "FONT-SIZE:18PX;" > Number of seconds: {{today | date: ' SS '}} <!----the first few seconds in a minute: {{today | date: ' s '} <!--2--and milliseconds: {{today | date: '. SS S '} <!--. 995--></span>

character formatting

<span style= "FONT-SIZE:18PX;" > PM ID: {{today | date: ' A '}} <!--AM--and four-bit time zone ID: {{today | date: ' Z '}} <!---0700--></span>

3. FilterThe Filter filter can select a subset from the given array and generate a new array to return. This filter is commonly used to filter the elements that need to be displayed. For example, when doing a client search, you can immediately filter out the desired results from an array . The first parameter of this filter can be a string, an object, or a function to select an element from an array.

<span style= "FONT-SIZE:18PX;" >{{[' Ari ', ' Lerner ', ' likes ', ' to ', ' Eat ', ' Pizza '] | filter: ' e '}}<!--["Lerner", "likes", "Eat"]-->{{[{' Name ': ' Ari ', ' City ': ' San Francisco ', ' favorite food ': ' Pizza '},{' name ': ' Nate ', ' City ': ' San Francisco ', ' favorite food ': ' Indian food '}] | filter:{' favorite food ': ' Pizza '}}}<!--[{"Name": "Ari", "City": "SanFrancisco", "Favoritefood": "Pizza"}]- </span>

4. JSON
A JSON filter can convert a JSON or JavaScript object into a string. This conversion is very helpful for debugging:

<span style= "FONT-SIZE:18PX;" >{{{' name ': ' Ari ', ' City ': ' SanFrancisco '} | json}}<!--{"name": "Ari", "City": "San Francisco"}--></span >

5. LimitTo
The incoming parameter is controlled by the positive negative value of the incoming parameter to control the interception from the front or from the back. For example, we can intercept the first three characters of a string:

<span style= "FONT-SIZE:18PX;" >{{San Francisco is very cloudy | limitto:3}}<!--san--></span>

or the last six characters:

<span style= "FONT-SIZE:18PX;" >{{San Francisco is very cloudy | limitto:-6}}<!--Cloudy--></span>

<span style= "FONT-SIZE:18PX;" ></span>

6. LowercaseThe lowercase filter converts the string to lowercase.

<span style= "FONT-SIZE:18PX;" >{{"San Francisco is very cloudy" | lowercase}}<!--San Francisco is very cloudy--></span>

7. numberthe number filter formats numbers as text. Its second parameter is optional and is used to control the number of bits that are intercepted after the decimal point. If a non-numeric character is passed in, an empty string is returned.

<span style= "FONT-SIZE:18PX;" >{{123456789 | number}}<!--1,234,567,890--></span>

8.The order by filter can sort the specified array with an expression. We'll sort the following object array with the Name field:

<span style= "FONT-SIZE:18PX;" >{{[{' Name ': ' Ari ', ' status ': ' Awake '},{' name ': ' Q ', ' status ': ' Sleeping '},{' name ': ' Nate ', ' status ': ' Awake '} | By: ' Name '}}<!--[{"Name": "Ari", "status": "Awake"},{"name": "Nate", "status": "Awake"},{"name": "Q", "status": "Sleeping"}]--></span>

9. Uppercasethe uppercase filter can convert a string to uppercase:

<span style= "FONT-SIZE:18PX;" >{{"San Francisco is very cloudy" | uppercase}}<!--San Francisco is very cloudy--></span>

Custom FiltersIt also defines a function, writes the requirements inside, and then returns. For example:

<span style= "FONT-SIZE:18PX;" >angular.module (' myapp.filters ', []). Filter (' Capitalize ', function () {return function (input) {///input is the string we passed in if (input) {return input[0].touppercase () + input.slice (1);}}); </span>

<span style= "FONT-SIZE:18PX;" ><!--Ginger loves dog treats-->{{' Ginger loves dog treats ' | lowercase | capitalize}}</span>

Summarythe accumulation of knowledge, we have time to see, to leave an impression on everyone.

AngularJS (vi)--Filter