vendredi 25 mars 2016

Per-Model Promise status on Ember.js loading template

I have an Ember.js (2.3) SPA. In a parent route for a part of the application, I'm loading quite a bit of data (~3.5MB) over many different Model types:

App.ParentRoute = Ember.Route.extend
  model: ->
    Ember.RSVP.hash
      foos: @store.findAll "foo"
      bars: @store.findAll "bar"
      bazes: @store.findAll "baz"
      quxes: @store.findAll "qux"

What I'd like to do is augment my existing parent loading template (currently just a spinner .gif) with information on the status of each of these promises. So when the template first renders it shows each model type:

[ ] Loading Foos...
[ ] Loading Bars...
[ ] Loading Bazes...
[ ] Loading Quxes...

and then as each Promise in the RSVP.Hash resolves, it's shown as an indicator of progress:

[ ] Loading Foos...
[X] Loaded 16 Bars
[ ] Loading Bazes...
[X] Loaded 213 Quxes

I see documentation for a Route loading action but it's using a controller and the documentation seems to indicate that controllers being deprecated (I haven't used any controllers yet in the project).

How do I access Promise state from a model() within the loading template?




Aucun commentaire:

Enregistrer un commentaire