Accessing model's data from beforeModel

We’re trying to delay the time taken for the model to render. But only the data from the model() is displayed. How to access the data from the beforeModel in the route ?

The return values of beforeModel() and afterModel() hooks are not assigned to a property on the controller. Just the return value of model() will be assigned to controller.model.

That said, you should see the 16s delay before your template is rendered.

1 Like

@jasonmit Okay, so how to use the data from the afterModel? Using setupController ?

Okay, so how to use the data from the afterModel?

You typically wouldn’t.

Are you trying to return multiple values in your model hook? That can be achieved with:

import rsvp from 'rsvp';

export default Route.extend({
  model() {
    return rsvp.hash({
      foo: fetchFoo(),
      bar: fetchBar()
    });
  }
});
1 Like

Thanks for your reply.

I don’t want to return multiple values from my model. What I wanna achieve is, when my page loads I want my beforeModel’s data to be displayed after delay, and then the model() and then the afterModel()'s data.

How can this be achieved?

Using this, I can load only my data in the afterModel.

I would not use these hooks for that purpose. The template renders after setupController is invoked, so after beforeModel, model, and afterModel is invoked.

If what you’re trying to do is change the model every few seconds you can initiate that work in setupController.

Example:

1 Like

Got it. Just wanted to understand the working of these hooks and their order of execution.

I get that beforeModel() is for making any transitions before you load the actual model. Can you explain when and where we should go for afterModel() hook ? An usecase will also do.

Thanks in advance.

They fire in blocking order from beforeModel > model > afterModel.

Meaning, they will wait for each promise to resolve before moving on to the next hook.

Personally, I never use afterModel but one use might be doing some async work after your model resolves with the result of the model hook.

1 Like

Okay, thank you so much !