Before Splats. Spoiler: it is all about tagless components

There is a recurring question about components that appear in Slack: how can I pass different attributes to a component depending on a given object? As an example, people want to be able to do something like the object spread operator in ECMAScript. Object Spread Properties The TC39 proposal Object Rest/Spread Properties for ECMAScript gives …

Read moreBefore Splats. Spoiler: it is all about tagless components

The Path to Contextual Components: Contextual Components

Contextual components are introduced in Ember.js 2.3 to improve component composition and the usage of components for DSL. Contextual components bring three new features to Ember: The hash helper: this simple helper just returns a hash with the attributes passed to it. Closure components: similar to closure actions, a closure component encapsulates a component with …

Read moreThe Path to Contextual Components: Contextual Components

The Path to Contextual Components: Understanding dynamic components

The component helper allows the user to render a component based on a given name. Given these two components: {{! app/templates/components/first-component }} This is first-component {{name}} {{! app/templates/components/second-component }} This is second-component {{name}} We can render dynamically any of them with the following invocation: {{component componentToRender name=’Sergio’}} The first parameter contains the name of the …

Read moreThe Path to Contextual Components: Understanding dynamic components

The Path to Contextual Components: Understanding positional parameters.

Ember.js 2.3 introduces a brand new feature: contextual components. This feature aims to better component composition and the usage of components for DSL. Before diving into this new feature, we will go through some of the details of current components invocation. In this post, we will see how positional params are used. Positional params Vs. …

Read moreThe Path to Contextual Components: Understanding positional parameters.