Mixing ember-data and non ember-data models

Question

In my API and on my server I have a model hierarchy like this:

WorkoutPlan->workouts->exercises

I can successfully load that structure with DS.hasMany relationships.

However, my client side view breaks up the plan into weeks so it would be nice to have a client side model structure of

WorkoutPlan->weeks->workouts->exercises

Is it possible to do this if weeks isn't an ember-data model?

If not, should I just transform my JSON so that I can has a hasMany on a Week model (workouts have a week column I could use as a quasi id for the week model).

Or would it be best to keep the current model structure and just somehow filter workouts somehow by week.

Miguel Madero Miguel Madero · Accepted Answer · 2013-11-08T01:15:24

Your ember model doesn't have to mimic your server model. There're usually good reasons to de-normalize, minimize the amount of data and simplify the model. For example, the server deals with multiple users, your ember app is likely just concerned with one.

I see two options here. I don't know enough about your model to suggested what's the best.

Add WeekPlan as a model. You could change the serialization logic in your server (if you have an app specific API) or change this during the serialization client side (if this change won't make sense for other API consumers).
Add a filter in your workout router. Also you could have an ArrayController with weeks that simply aggregates the weeks from the workouts in a workout plan.

In general I would lead towards 1, but as I said I don't know enough about your model to make a strong case for either.

Update. Expand on 2

There're two parts to this. The first one is the WeekPlanRoute. That might look something like the following. It's basically responsible to create an array of Weeks and uses that to pass it to pass the workouts to a WorkoutRoute/Controller

App.WeekPlaneRoute = Ember.Route.extend({
  model: function(){
    // assuming we already have a WorkoutPlan
    return workoutPlan.workouts.mapBy('week');
  },
);

Then you can navigate to the workouts by using a link-to that passes the week as a parameter:

{{#each}}
  {{#link-to 'workouts.index' this}}{{/link-to}}
{{/each}}

In your WorkoutRoute you will filter using that parameter:

Todos.WorkoutRoute = Ember.Route.extend({
  model: function(params){
    // assuming we already have a WorkoutPlan
    return workout.filterBy(params.weekNumber);
  }
);

You will also have to change your route to add that dynamic segment for the weekNumber (it has to match that param used above).

this.resource('workouts', {path: '/workouts/:weekNumber'});

Mixing ember-data and non ember-data models

1 Answers