CODEWITHSUNDEEP
ember.js
Dziamid
Dziamid

Reputation: 11579

Ember data ModelArray not displaying correctly

var App = Em.Application.create();

App.store = DS.Store.create({
    adapter: DS.RESTAdapter.create()
});

App.Todo = DS.Model.extend({
    title: DS.attr('string')
});

App.set('Todos', DS.ModelArray.create({
    store: App.store,
    type: App.Todo,
    content: []
}));

var todo = App.store.createRecord(App.Todo, {
    title: 'Cleanup'
});
App.get('Todos').pushObject(todo);

App.MyView = Em.View.extend({
    todosBinding: 'App.Todos'
});

  <script type="text/x-handlebars">
    {{#view App.MyView}}
      {{#each todos}}
        Todo: {{title}}
      {{/each}}
    {{/view}}
  </script>

Expected output:

Todo: Cleanup

What i actually get is:

Todo:

The title attribute is not displayed. If you inspect App.Todos.content, the object is there with correct title. Why is it not showing up in the view?

Upvotes: 0

Views: 959

Answers (1)

Mike Aski
Mike Aski

Reputation: 9236

I changed a little of your code to give it a more standard architecture: You should use a controller to retrieve the data, not instantiate the model array yourself, especially when using RestAdapter... (In this sample, I replaced the RestAdapter by the fixtureAdapter just to have it running offline).

var App = Em.Application.create();

App.store = DS.Store.create({
    revision: 3,
    adapter: DS.fixtureAdapter //DS.RESTAdapter.create()
});

App.Todo = DS.Model.extend({
    title: DS.attr('string')
});

App.Todo.FIXTURES = [{
    title: 'Cleanup'
}];

App.myController = Em.ArrayController.create({
    init: function() {
        this.set('content', App.store.findAll(App.Todo));
    }
});

App.MyView = Em.View.extend({
    todosBinding: 'App.myController.content'
});

Upvotes: 2

Related Questions