Home/ Questions/Q 8849527
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-14T12:40:34+00:00

I’m trying to understand the basic concepts of ember.js and how the whole template/view

  • 0

I’m trying to understand the basic concepts of ember.js and how the whole template/view stuff works together (and some best practices), but, I really have problems to find answers to my questions…. So, maybe, one of you can help me…

  1. “Getting started” says: “You can use Ember.View to render a Handlebars template and insert it into the DOM” and it suggests the usage of view.append(). I downloaded to getting started kit and there is a template, a view and it’s beeing displayed without a view.append(). Why?

  2. I tried to extend the template with a placeholder {{ message }} added a attribute with the same name to the view, and assigned a value, but its not rendered. Why?

Can someone please bring some light to me… Many thanks in advance. Links and good Stackoverflow threads are very welcome.

Some code examples:

index.html:

<script type="text/x-handlebars" data-template-name="application">
<h1>Hello from Ember.js</h1>
</script>

app.js

App.ApplicationView = Ember.View.extend({
  templateName: 'application',
  message : 'Hallo Du'
});

If I change ‘application’ to ‘application_”, it will still be rendered… So, why do I define a template name?

Best regards
Peter

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Like I said in the comments, in Ember 1.0pre (and newer releases), to display view attributes/properties you have to do {{view.YourAttributeName}}, so you have to user {{view.message}} in your handlebars template. So here’s what you have to do in your js:

    App = null;

$(function() {

    App = Em.Application.create();

    App.ApplicationView = Ember.View.extend({
      templateName: 'application',
      message : 'Hallo Du'
    });
})

    And here’s the html page with the template:

    <body>

    <script type="text/x-handlebars">
        <h1>Hello from Ember.js</h1>
         {{view.message}}
    </script>

    <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js" ></script>
    <script type="text/javascript" src="http://cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.rc.1.js" ></script>
    <script type="text/javascript" src="http://cloud.github.com/downloads/emberjs/ember.js/ember-latest.js" ></script>
</body>​

    Check this very basic fiddle with the code above working: http://jsfiddle.net/schawaska/MwXjG/

    • 0