Ember associations and nested URLs

Question

We're implementing a feature using Ember data and Rails and keep hitting a snag. We're not sure if it's a problem with our code, a bug with Ember or Ember data or just that we're not getting it because of a lack of documentation.

Any help would be really appreciated.

Rails

We have a to do list, with multiple entries. In Rails, they are set up as follows:

class ToDo < ActiveRecord::Base
   has_many :to_do_entries, dependent: :destroy
   alias_method :entries, :to_do_entries
   validates_presence_of :title
end

class ToDoEntry < ActiveRecord::Base
  attr_accessible :completed_at, :is_deleted, :priority, :title

  belongs_to :to_do
  alias_method :parent, :to_do

  validates_presence_of :to_do, :title     
end

The routes are set up as nested:

resources :to_dos do 
   resources :to_do_entries do
   end
end

And so the end URLs end up being /to_do/:to_do_id/to_do_entry/:to_do_entry_id.

We're using the active_model_serializers gem and have the following serializers set up:

class ToDoSerializer < ActiveModel::Serializer
  attributes :id,
             :title

  has_many :to_do_entries, embed: :objects
end

class ToDoEntrySerializer < ActiveModel::Serializer
  attributes :id,
             :to_do_id,
             :title,
             :priority

  has_one :to_do
end

Ember

We're using Ember data and the REST adapter and the equivalent models are set up as follows:

App.ToDo = DS.Model.extend({
  title: DS.attr('string'),
  entries: DS.hasMany('App.ToDoEntry', { embedded: true })
});

App.ToDoEntry = DS.Model.extend({
  title: DS.attr('string'),
  to_do_id: DS.attr('number'),
  priority: DS.attr('number'),
  todo: DS.belongsTo('App.ToDo')
});

The Problem

My understanding is that we should be able to access the list of entries directly from the ToDo, by using the following in the console:

> t = App.ToDo.find(21)
> e = t.get("entries")

This does seem to work, but just returns a class and I have no idea how to debug it and see if it's working.

I have two specific questions:

How can we debug, using the console, the associations and make sure that they are correctly working.
If we load the entries separately (rather than having them embedded in the parent), how can we make it use nested routes like the one we have above?

You could do something like t.get("entries").toArray(). You'll be able to verify the IDs. And you can do something like t.get("entries").toArray()[0].get('title') to inspect a given property. I don't believe nest routes are supported out of the box with the REST adapapter. There was actually an issue about it that I opened and it has now been closed. I have yet had a chance to try to implement nested routes in my adapter (I'm using a work-around on the server for now). — Sean O'Hara

Bradley Priest Bradley Priest · Accepted Answer · 2012-10-22T14:43:52

Firstly, getting an association from a model returns a DS.ManyArray which contains your objects like you assumed.
There are a couple of ways to debug this, firstly it responds the normal array methods such as length, firstObject, lastObject, objectAt.
If that isn't helpful enough, it also responds to toArray which converts it to a vanilla JS Array.

Unfortunately, the latest iteration of ember-data actually removes embedded records (I think this might be temporary though). Currently nested resource URLs are not supported by the default RESTAdapter, but you can always customize it to suit your needs

There is however work being done on getting nested resources into core see PR's #367 and #257

Ember associations and nested URLs

1 Answers