Ember Router logs error: "Ember.CollectionView's content must implement Ember.Array"

Question

Fairly straight-forward Ember question here, (I hope!).

I have a simple Ember-data setup. One App has many Versions. Here's my App model:

App.App = DS.Model.extend({
  name: DS.attr('string'),
  publicKey: DS.attr('string'),
  versions: DS.hasMany('App.Version', { key: 'version_ids' })
});

My router is fairly simple:

App.Router = Ember.Router.extend({
  location: 'hash',
  root: Ember.Route.extend({
    index: Ember.Route.extend({
      route: '/',
      redirectsTo: 'dashboard'
    }),
    dashboard: ...,
    app: Ember.Route.extend({
      route: '/:app_id',
      connectOutlets: function(router, app) {
        router.get('applicationController').connectOutlet('appTest', app);
      },

      index: Ember.Route.extend({
        route: '/',
        connectOutlets: function(router) {
          appTestController = router.get('appTestController');
          appTestController.connectOutlet('addCommentOutlet', 'addComment', {});
          appTestController.connectOutlet('versions', appTestController.get('content.versions'));
        }
      })
    })
  })
});

And the views and controllers look like this:

App.AppTestView = Ember.View.extend({
  templateName: 'app_test'
});

App.VersionsView = Ember.View.extend({
  templateName: 'versions'
});

App.AppTestController = Ember.ObjectController.extend({
});

App.VersionsController = Ember.ArrayController.extend({
});

When I run it unfortunately I get the error: an Ember.CollectionView's content must implement Ember.Array. You passed <App.Version:ember519>.

Interestingly, if I add brackets around [appTestController.get('content.versions')] in the router it doesn't complain and creates an array with the first Version object correctly. But it doesn't seem to want to show more than one object.

Any tips?

Answer 1

In the end, it wasn't the models, view objects or controllers! It wasn't even the router.

It was versions.handlebars. I had a loop within a loop in my template, as below:

{{#each version in controller}}
  Version here
  {{#each comment in version}}
    {{comment.text}}
  {{/each}}
{{/each}}

I'd incorrectly written:

each comment in version

... where I'd meant to write:

each comment in version.comments

:) That explains the error message. Hope this helps somebody else!