Rendering Values

For Modifiers, there is a specific syntax that only modifiers may reside in

<div {{someModifier}}>

or via property on some object

<div {{this.property.someModifier}}>

or via an argument passed to a component

<div {{@someModifier}}>

Modifiers can be curried with the modifier helper:

{{! In a component called "Example" }}
{{yield (modifier someModifier "arguments" "here")}}

{{! Usage: }}
<Example as |theModifier|>
  <div {{theModifier}}>
</Example>

For Helpers, there is a specific syntax that only helpers may reside in

{{ (theHelper) }}

or nested in a sub-expression

{{yield (hash key=(theHelper) key2=(theHelper with args)) }}

or via property on some object

{{ (this.property.theHelper) }}

or via an argument passed to a component

{{ (@theHelper) }}

Helpers can be curried with the helper helper:

{{! In a component called "Example" }}
{{yield (helper someHelper "arguments" "here")}}

{{! Usage: }}
<Example as |theHelper|>
  {{ (theHelper) }}
</Example>

For Components, there is a specific syntax that only components may reside in

<AComponent />

or via a property on some object

<this.someComponent />

or via an argument passed to a component

<@someComponent />

Components can be curried with the component helper:

{{!
  In a component called "Example".
  Note that components may only receive named arguments
}}
{{yield (component someComponent foo="arguments" bar="here")}}

{{! Usage: }}
<Example as |theComponent|>
  <theComponent />
</Example>