How to bind response of Ajax request to Model in EmberJs?

Question

I am new to Ember, I have a running application where I need to put Chat app in it.

1. I need to have list of last messages of different users from Chat model (Rails end) {Done}
2. On clicking any message I will have a list of conversation of that particular message. {Done: ajax request and got response}
3. I don't know how to pass this response back to exact same template or bound to the same chat model, so I created an HTML and passed that response to that HTML. {Done}
4. But due to this above approach I lost ember data binding and any new messages via Pusher does not appear in chat window.

I also tried another work around to have all the chat messages at once on Ember end, and then apply groupBy on userId to only show last messages of particular user and then on click show detail conversation list using filter sort of thing.

But honestly, I am not sure if any of the above solution is the right way towards the success.

Answer 1

So, here is what I did to achieve it,

I made a function in controller to make it available in emblem template for records to loop over it. And in that function called

@get('model')

to get all the records from Ember Data Model. (Which I was doing with 'controller' in emblem template)

Then in ajax response I did,

      **success: (data, status, response) =>
        @store.unloadAll('model_name')
        @store.pushPayload('model_name', data)**

Everything working as expected.