How to compose a dynamic list using a static array and a promise with ember.js

Question

I'm working with ember.js 1.0 (pre 4) and ember-data rev 11

I have a data model that needs to expose a list that is a combination of a static array (already in memory at the time) and a promise (that will return a list of related ember-data models).

App.Day = DS.Model.extend({
    appointments: function() {
        //this will hit a backend server so it's slow
        return App.Appointment.find();
    }.property(),
    slots: function() {
        //no need to hit a backend server here so it's fast
        return App.Slot.all();
    }.property(),
    combined: function() {
        //return a list of both slots + appointments after some logic is applied
    }.property()
});

How can I combine both slots and appointments in a property when the appointments are effectively a promise because they are loaded on demand.

I need to do some logic in this combined property so a simple merge of these 2 arrays is not ideal. Thank you in advance!

Shimon Rachlenko Shimon Rachlenko · Accepted Answer · 2013-02-06T20:57:26

The simple solution is to get AdapterPopulatedRecordArray returned by App.Appointment.find() and add to it objects from RecordArray returned by App.Slot.all(), something like:

combined: function() {
    //return a list of both slots + appointments after some logic is applied
    var apts = this.get('apppointments'),
    slots = this.get('slots');
    apts.addObjects(slots);

    return apts;

}.property('appointments', 'slots')

How to compose a dynamic list using a static array and a promise with ember.js

1 Answers