Best way to load data from other route

1

Hi!

For example, I have two models: book and author, and I created forms for them I have lookup field for searching of authors on book’s form and want to display modal box with list of authors when user clicks on this field. For that I create new component “modal-lookup-grid”. But I must pass list of authors to this component, but what can I do if this list is very big?.. I can’t load it when the form is opened. I do the following in my component:

this.container.lookup('store:application').findQuery('author', params); // params is for purpose of pagination.

But I think that it is not “ember way” with its routes and model’s hooks.

how you do it in your applications?

2

You could try the route.modelFor() method, which takes a route name as an argument.

3

Thank you! But I can’t do that because

Returns the model of a parent (or any ancestor) route in a route hierarchy. During a transition, all routes must resolve a model object, and if a route needs access to a parent route’s model in order to resolve a model (or just reuse the model from a parent), it can call this.modelFor(theNameOfParentRoute) to retrieve it.

and there is no direct access to route in component. Structure of my app

route: open an item's form
   controller: actions (save, remove)
       component: my form with fields of the item
           component: associations of current item
                component: actions with associations:
                    button: select existing item - open grid with many items (include searching, pagination) in popup
                    button: create new associated item - open simple form for creating of new item in popup

In last component I use

this.container.lookup('store:application').findQuery('item', params);

and

this.container.lookup('store:application').createRecord('item');

but I think that it is not good idea

4

First off I think try stay away from using the container directly. If you’re going to use the store, rather inject it using:

...
export default Ember.Component.extend({
    store: Ember.inject.service(),
...

Then I would think about consolidating this logic into a service which you can inject into your component.

Then you need to decide how fresh you want the data in the author list to be. If you want fresh data then you should keep using the findQuery() method, but if you don’t mind some stale data you could use the store.all() method which will only return what is currently in the store and then you could filter that data.

If you do decide to use store.all() you could do an initial fetch for all authors when your service is initialized.