Angular Js Filters (v1.3.0) Cheat Sheet: by Via

You might also like

Download as pdf or txt
Download as pdf or txt
You are on page 1of 2

Angular Js Filters (v1.3.

0) Cheat Sheet
by Roman K. (Roman) via cheatography.com/19465/cs/2500/

Filter Usage date date: format (cont)

In HTML date, Date | number |string m Minute in hour (0-59)

{{ value | filter​_name : arg1 : arg2 }} Date to format either as Date object, ss Second in minute, padded (00-
millis​​econds (string or number) or various 59)
In Javasc​ript
ISO 8601 datetime string formats. s Second in minute (0-59)
$filt​​er(​​'f​ilt​er_​nam​e')​(value, arg1, arg2)
format (?), string .sss Millis​econd in second, padded
(000-999)
Formatting rules. If not specified,
currency
mediumDate is used. a AM/PM marker
amou​​nt, number
Z 4 digit (+sign) repres​ent​ation of
Formats date to a string based on the
Input to filter the timezone offset (-1200​-
requested format.
+1200)
symbol (?), string
json ww ISO-8601 week of year (00-53)
Currency symbol or identifier to be displayed
w ISO-8601 week of year (0-53)
obje​​ct, *
number medium equivalent to 'MMM d, y
Any JavaScript object (including arrays and
h:mm:ss a' for en_US locale
numb​​er, number | string primitive types) to filter.
short equivalent to 'M/d/yy h:mm a'
Number to format Allows you to convert a JavaScript object into for en_US locale
JSON string.
frac​​ti​o​n​Size (?), number | string fullDate equivalent to 'EEEE, MMMM d,

Number of decimal places to round the y' for en_US locale


date: format
number to. If this is not provided then the longDate equivalent to 'MMMM d, y' for
fraction size is computed from the current yyyy 4 digit repres​ent​ation of year (e.g. en_US locale
locale's number formatting pattern. Default: AD 1 => 0001, AD 2010 => 2010)
mediumDate equivalent to 'MMM d, y' for
3. yy 2 digit repres​ent​ation of year, en_US locale
padded (00-99). (e.g. AD 2001 =>
Number of decimal places to round the number shortDate equivalent to 'M/d/yy' for
01, AD 2010 => 10)
to. en_US locale
y 1 digit repres​ent​ation of year, e.g.
mediumTime equivalent to 'h:mm:ss a' for
(AD 1 => 1, AD 199 => 199)
uppercase en_US locale
MMMM Month in year (Janua​ry-​Dec​ember)
input, string shortTime equivalent to 'h:mm a' for
MMM Month in year (Jan-Dec) en_US locale
Converts string to uppercase.
MM Month in year, padded (01-12)

M Month in year (1-12) filter


lowercase
dd Day in month, padded (01-31) array, Array
input, string
d Day in month (1-31) The source array.
Converts string to lowercase.
EEEE Day in Week,(​Sun​day​-Sa​turday) expr​​es​s​i​on, string | Object | functi​on()
EEE Day in Week, (Sun-Sat) The predicate to be used for selecting items
limitTo
HH Hour in day, padded (00-23) from array.
input, Array | string
H Hour in day (0-23)
Source array or string to be limited.
hh Hour in AM/PM, padded (01-12)
limit, string | number
h Hour in AM/PM, (1-12)
The length of the returned array or string.
mm Minute in hour, padded (00-59)
Creates a new array or string containing only a
specified number of elements.

By Roman K. (Roman) Published 27th September, 2014. Sponsored by Readability-Score.com


cheatography.com/roman/ Last updated 4th October, 2014. Measure your website readability!
Page 1 of 2. https://readability-score.com
Angular Js Filters (v1.3.0) Cheat Sheet
by Roman K. (Roman) via cheatography.com/19465/cs/2500/

filter (cont) orderBy (cont)

comp​​ar​a​t​or, funct​io​n​(​ac​tual, expected) | true | expr​​es​s​i​on, funct​ion() | string | Array.


undefi​ned (​​f​u​n​ct​​ion​​(​)|​s​t​ri​ng)​>

Comparator which is used in determ​​ining if A predicate to be used by the comparator to


the expected value (from the filter determine the order of elements.
expres​​sion) and actual value (from the
reve​​rse​ (?), boolean
object in the array) should be considered a
match. reverse the order of the array.

Selects a subset of items from array and Orders a specified array by the expression
returns it as a new array. predicate. It is ordered alphab​​et​i​cally for
strings and numeri​​cally for numbers.

filter: expression
orderBy: expression
Expr​ess​ion — the predicate to be used for
selecting items from array. A predicate to be used by the comparator to
determine the order of elements.
string
function
The string is evaluated as an expression
and the resulting value is used for substring Getter function. The result of this function

match against the contents of the array. All will be sorted using the <, =, > operator.

strings or objects with string properties in string


array that contain this string will be returned.
An Angular expres​sion. The result of this
The predicate can be negated by prefixing
expression is used to compare elements
the string with !.
(for example name to sort by a property
Object called name or name.s​ubs​tr(0, 3) to sort by

A pattern object can be used to filter specific 3 first characters of a property called name).

properties on objects contained by array. A The result of a constant expression is

special property name $ can be used (as in interp​reted as a property name to be used in

{$:"​tex​t"}) to accept a match against any compar​isons (for example "​special name" to
property of the object. That's equivalent to sort object by the value of their special
the simple substring match with a string as name property). An expression can be
described above. optionally prefixed with + or - to control
ascending or descending sort order (for
functi​on(​value, index)
example, +name or -name). If no property is
A predicate function can be used to write provided, (e.g. '+') then the array element
arbitrary filters. The function is called for itself is used to compare where sorting.
each element of array. The final result is an
Array
array of those elements that the predicate
returned true for. An array of function or string predic​ates. The
first predicate in the array is used for sorting,
but when two items are equiva​lent, the next
orderBy
predicate is used.
array, Array
f the predicate is missing or empty then it
The array to sort. defaults to '+'.

By Roman K. (Roman) Published 27th September, 2014. Sponsored by Readability-Score.com


cheatography.com/roman/ Last updated 4th October, 2014. Measure your website readability!
Page 2 of 2. https://readability-score.com

You might also like