ember-angle-bracket-invocation-polyfill

This addon provides a polyfill for angle bracket invocation syntax as described
in RFC 311 and RFC
457. It's the same
components you know and love, no longer surrounded by mustaches. \o/


Installation

``
ember install ember-angle-bracket-invocation-polyfill
`

You will additionally need to ensure ember-cli-htmlbars-inline-precompile is at least version 1.0.3.

Usage

The best usage guide are the RFCs themselves
(emberjs/rfcs#311
emberjs/rfcs#457),
but here are a few examples of "before"/"after" to whet your appetite:

Before:

`hbs
{{site-header user=this.user class=(if this.user.isAdmin "admin")}}

{{#super-select selected=this.user.country as |s|}}
{{#each this.availableCountries as |country|}}
{{#s.option value=country}}{{country.name}}{{/s.option}}
{{/each}}
{{/super-select}}
`

After:

`hbs



{{#each this.availableCountries as |country|}}
{{country.name}}
{{/each}}

`

$3

- Supports invoking components via angle brackets using TitleCase

`hbs

`

- Supports invoking components via angle brackets with self-closing syntax

`hbs

`

- Supports invoking components via angle brackets using paths

`hbs

`

- Supports invoking components via angle brackets using yielded block params

`hbs
{{#with (component 'foo-bar') as |Foo|}}

{{/with}}
`

- Supports passing arguments into invoked components with @ prefix

`hbs

`

- Supports passing attributes to be added to the root element of the component without @ prefix

`hbs

`

- Supports using has-block _inside_ the invoked component to determine if a block was provided

`hbs
{{! checking has-block inside would be false}}

{{! checking has-block inside would be true}}
`

- Supports yielding block params from inside the invoked component

`hbs
{{qux}}
`

- Supports passing ...attributes into another angle bracket invocation

`hbs

`

- Supports passing ...attributes into a non-component element

`hbs



`

- Supports passing ...attributes into tagless components
- Supports invoking single word components:

`hbs