Ember 1.5 How do I combine two record arrays?

Question

In my application I have a feed of items. Lets just says these two items are Tasks and Purchases.

In my feed I want both of these items to populate an array that is sorted by date. They both have similar properties, such as title, and date. As far as displaying them on the UI I have no doubt i will be able to figure that out.

The problem is getting the records.

store.find('task');
store.find('purchase');

Both of these return promise arrays. I assume I will need some sort of array proxy. But my current code will not update the array everytime a property is modified on an object in either of these arrays. And it will also not render correctly or change when objects are added to these stores.

Has anyone had any luck merging two record arrays into one? And having it function as if it were just one record array which updates on the fly perfectly with everychange to the array and the objects within.

Any help appreciated! If need more code i will post!

UPDATE::

Attached is a JSBIN that should display what I am trying to do, and the fact that it is not working.

http://emberjs.jsbin.com/jebugofo/2/edit?html,js,console,output

Answer 1

Here is your fiddle modified.

Im new to ember data. But from what I understand, you are merging 2 objects. I modified to convert the model object to array before merging.

var stream = Ember.A();
stream.pushObjects(txn.toArray());
stream.pushObjects(job.toArray());
return stream;

I also modified the property that your observing. Now Im observing the model data.

}.property('model.purchases.@each', 'model.tasks.@each'),

Answer 2

If you are asking how to retrieve both tasks and purchases inside one model - you can do the following:

App.YourRoute = Em.Route.extend({  
  model: function(params) {
    return Em.RSVP.hash({
      tasks:     this.store.find('task'),
      purchases: this.store.find('purchase')
    });
 },

Then in your template you can just do

<script type="text/x-handlebars" data-template-name="index">
  <h2>Tasks:</h2>
  <ul>
    {{#each tasks}}
      <li>{{title}}</li>
    {{/each}}
  </ul>
  <h2>Purchases:</h2>
  <ul>
    {{#each purchases}}
      <li>{{title}}</li>
    {{/each}}
  </ul>
</script>