Question

For the application I am developing Ember.js + Ember Data seems like a good solution. However I can not even get a simple version using both libraries to work. The problem is that the data provided by my JSON file is not correctly loaded or shown.

My app.js looks like. I run all libraries on the edge.

var App = Em.Application.create({});

App.store = DS.Store.create({
    revision: 6,
    adapter: DS.RESTAdapter.create({
        bulkCommit: false
    })
});

App.Item = DS.Model.extend({
    pluginName: DS.attr('string')
});

App.regionController = Em.ArrayController.create({
    content: App.store.findAll(App.Item)
});

I have one template that looks like:

<script type="text/x-handlebars">
    <ul>
    {{#each regionController}}
        <li>{{item}}</li>
    {{/each}}
    </ul>
</script>

The request to the json file is made correctly (I see the request pop up in Firebug) and has the following contents:

{
    items: [{
        "id": "3",
        "pluginName": "text"
    },
    {
        "id": "3",
        "pluginName": "split"
    }]
}

Can anyone spot what I am doing wrong?

Answer 1

Your template should probably look like this:

<script type="text/x-handlebars">
    <ul>
      {{#each item in regionController}}
        <li>{{item.pluginName}}</li>
      {{/each}}
    </ul>
</script>

Let me know if that works for you.