How can I update an application route's model from a child route?

Questions Data Modeling
1

I have 2 sidebars in my application template whose states are determined by boolean values in an object. This object is passed to my application template via the model hook in my application route. I want other routes hierarchically beneath the application route to modify the app route’s model so that the sidebar state can be determined by a route-by-route basis. Is there a way to accomplish this without having to resort to a service to bus the data between the child routes and the application template? Any input is appreciated, thank you!

2

Each route can use modelFor to get the model from its ancestor routes, so your child routes can do:

async model() {
  let myOwnModel = await doWhateverYouWereAlreadyDoingHere();
  let appModel = this.modelFor('application');
  return { myOwnModel, appModel };
}

This redefines the model in the child route’s template to be an object containing both things, so {{model.name}} would become {{model.myOwnModel.name}} and now you can also make changes to model.appModel.whatever.

1 Like