Expressions Evaluating expressions inside templates Guide

Expressions

Evaluating Expressions

Template expressions are evaluated against the template’s data context which includes the values and functions that are invokable for a template.

For an explanation of how a component’s data context is determined see component data context

Expressions are evaluated right to left with variables being read from the component’s data context

{concat firstName ' ' lastName}

evaluates to

concat(firstName, ' ', lastName);

Evaluation Order

If an intermediary function is found it will pass the result through naively

{titleCase concat firstName ' ' lastName}

evaluates to

titleCase(concat(firstName, ' ', lastName))

Parenthesis

If parenthesis are used it will respect the evaluation order

{formatDate (getDate now) 'h:mm'}

evaluates to

formatDate(getDate(now), 'h:mm'))

Expression Locations

Attributes

If an attribute expression includes quotes it will output as a string regardless of the expression value.

For instance

<a data-number="{getZero}">

will output as

<a data-number="0"></a>

Boolean Attribute

If an attribute expression omits quotes the entire attribute will be removed if the expression is falsey

<input type="checkbox" checked={isChecked} />

If true will output

<input type="checkbox" checked />

and if false will output

<input type="checkbox" />