ArrayController pushObject reference.type error

Question

EDIT: jsbin of problem. See comments in the testAddTom action method of IndexController.

I have a controller that adds a model object to another ArrayController in my app. However when I call pushObject on the ArrayController an error is thrown...

Uncaught TypeError: Cannot call method '_create' of undefined ember-data-latest.js:2769 DS.Store.Ember.Object.extend.materializeRecord ember-data-latest.js:2769 DS.Store.Ember.Object.extend.recordForReference ember-data-latest.js:1871 DS.RecordArray.Ember.ArrayProxy.extend.objectAtContent ember-data-latest.js:309 superWrapper ember.js:1044 Ember.ArrayProxy.Ember.Object.extend.objectAt ember.js:11475 superWrapper ember.js:1044 Ember.ArrayController.Ember.ArrayProxy.extend.objectAtContent ember.js:13111 superWrapper ember.js:1044 Ember.ArrayProxy.Ember.Object.extend.objectAt ember.js:11475 superWrapper ember.js:1044 Ember.Array.Ember.Mixin.create.arrayContentDidChange ember.js:8955 Ember.ArrayController.Ember.ArrayProxy.extend.arrayContentDidChange ember.js:13147 superWrapper ember.js:1044 Ember.ArrayProxy.Ember.Object.extend.arrangedContentArrayDidChange ember.js:11582 sendEvent ember.js:2432 Ember.Array.Ember.Mixin.create.arrayContentDidChange ember.js:8946 Ember.ArrayProxy.Ember.Object.extend.arrangedContentArrayDidChange ember.js:11582 sendEvent ember.js:2432 Ember.Array.Ember.Mixin.create.arrayContentDidChange ember.js:8946 Ember.Mixin.create.replace ember.js:12016 Ember.ArrayProxy.Ember.Object.extend.replaceContent ember.js:11371 Ember.ArrayProxy.Ember.Object.extend._replace ember.js:11487 Ember.ArrayProxy.Ember.Object.extend.replace ember.js:11493 Ember.ArrayProxy.Ember.Object.extend.replaceContent ember.js:11371 Ember.ArrayProxy.Ember.Object.extend._replace ember.js:11487 Ember.ArrayProxy.Ember.Object.extend._insertAt ember.js:11501 Ember.ArrayProxy.Ember.Object.extend.pushObject

The model object isn't new, it's already fetched earlier on. If I instead get the ArrayController content, convert it to an array, push the object to the array and then re-set the ArrayController.content it works okay.

My question is why isn't pushObject working? It seems the right thing to do.

pushObject code sample which breaks...

App.TaskController.reopen({
    needs: ['reminder'],

    showReminderForTask: function(reminder) {
        var reminders = this.get('controllers.reminders');

        if (!reminders.content.contains(reminder)) {
            reminders.pushObject(reminder);
        }
    }
});

ArrayController.content example which works....

App.TaskController.reopen({
    needs: ['reminder'],

    showReminderForTask: function(reminder) {
        var reminders = this.get('controllers.reminders');

        if (!reminders.content.contains(reminder)) {
            var content = reminders.content.toArray();
            content.push(reminder);
            reminders.set('content', content);
        }
    }
});

intuitivepixel intuitivepixel · Accepted Answer · 2013-05-27T22:44:55

I guess your problem is that you are trying to use pushObject on the controller itself which does not automatically forwards the pushed objects to the content property of the controller, and therefore it breaks.

You should rather do this:

App.TaskController.reopen({
  needs: ['reminder'],

  showReminderForTask: function(reminder) {
    var remindersContent = this.get('controllers.reminders.content');

    if (!remindersContent.contains(reminder)) {
        remindersContent.pushObject(reminder);
    }
  }
});

I've put together a jsbin that show that using pushObject on the content property should work as expected.

Hope it helps

ArrayController pushObject reference.type error

1 Answers