Deliver Audacious Web Apps with Ember 2

Define a Component User Interface

The process of building a component user interface should be familiar to you. For the most part, you use the same set of expressions to build a component interface as you do to build a template. The interface is composed using Handlebars expressions and HTML, and can access any properties defined by the component initialization in the calling template.

As an example, let’s take a look at the interface for the edit-note template:

ch4/ember-note/app/templates/components/edit-note.hbs

<div>
  {{input value=note.title}}
  <button {{action "saveNote"}}>save</button>
  <button {{action "closeNote"}}>close</button>
</div>
<div>
  {{textarea rows=10 cols=60 value=note.body}}
</div>
<div>
 {{markdown-to-html ...