Ember Octane is here! A lot has changed since Ember 3.14, including these Guides. Read more in the Ember Blog.

Old Guides - You are viewing the guides for Ember v1.10.0. VIEW v3.15.0
Edit Page

Defining a View


You can use Ember.View to render a Handlebars template and insert it into the DOM.

To tell the view which template to use, set its templateName property. For example, if I had a <script> tag like this:

<html>
  <head>
    <script type="text/x-handlebars" data-template-name="say-hello">
      Hello, <b>{{view.name}}</b>
    </script>
  </head>
</html>

I would set the templateName property to "say-hello".

var view = Ember.View.create({
  templateName: 'say-hello',
  name: "Bob"
});

Note: For the remainder of the guide, the templateName property will be omitted from most examples. You can assume that if we show a code sample that includes an Ember.View and a Handlebars template, the view has been configured to display that template via the templateName property.

You can append views to the document by calling appendTo:

view.appendTo('#container');

As a shorthand, you can append a view to the document body by calling append:

view.append();

To remove a view from the document, call remove:

view.remove();