Ember JS, updating array not reflecting in views

Question

Updating Ember JS array is not reflecting in views.

Controller

App.MyController = Ember.ArrayController.extend({
  results: [],
  init: function(){
    _this = this
    App.MyModel.find({}).then(function(contents) {
      obj1 = contents.objectAt(0)
      obj1.get('data').hasMany.results.forEach(function(item){
          _this.results.push(item)
      });
    })
    //rest of the code
  }
})

Template

{{#each results}}
  // show items of reults.
{{/each}}

This is the piece of code in which i am fetching data from server, and upon its loading, i am pushing it into results array. This loading for data from server takes some time, so template maps over the empty results array. Ideally, results array should update the things in template but logically it shouldn't.

Does any body know where i am missing? or doing wrong.

Thanks in advance.

Answer 1

For bindings to work you have to use pushObject instead of push.

App.MyController = Ember.ArrayController.extend({
  results: [],
  init: function(){
    _this = this;
    App.MyModel.find({}).then(function(contents) {
      obj1 = contents.objectAt(0);
      obj1.get('data').hasMany.results.forEach(function(item){
        _this.results.pushObject(item)
      });
    })
    //rest of the code
  }
});

Fore more info on ember array pushObject please see here.

Hope it helps.