Pass object to non-dynamic route

1

Hi there,

I cannot find any information about how to pass any object to non-dynamic route. I have the following route

this.route('entity', {path: '/:entity_id'}, function() {
    this.route('config', function() {});
});

And in entity template.hbs I have button to open its config and pass config object (it is not ember model) to that route

actions: {
    openConfig() {
        const config = this.createConfig();

        this.transitionToRoute('config', config);
    }
}

And in config route.js I want to get this object

model() {
    // Idk how to get that object here and is it possible?
}

The reason why I want to make like that because entity has big logic and I want to split it by sub-routes to make support easier.

Thank you!

2

if you pass the config object into transitionToRoute as you described (this.transitionToRoute('config', config);) it should automatically inject it as the child model and skip the child model hook (see the docs)

alternatively you could use a service to look up the config in the child route model hook

1 Like
3

That pattern you described is likely to break as soon as someone tries to refresh the page on the config route. Passing the model to transitionTo will skip the model() hook, but then if users refresh directly while they’re already on the config route, the model() hook is going to run and need to know what to do on its own. It needs to call createConfig.

If createConfig is complicated but stateless, make it a separate library function that’s imported by all the places that need it. If it’s stateful, put it on a Service.

4

I would create the config in the parent route’s model hook, then use this.modelFor to use that same model in whatever routes need the config. Something like this:

// app/routes/entity.js

model() {
  return this.createConfig();
}

// app/routes/entity/config.js

model() {
  return this.modelFor('entity');
}

Then there is no need to pass it anywhere, it will pull in the model from the other route. The model hook can be used for loading any data, not just ember-data models.

5

Thanks, everyone! But I have the following question. How to pass an object to a single static route

Router.map(function() {
  this.route('create');
});

and in controller I want to pass object to this route

export default Controller.extend({
    actions: {
        goToCreate() {
            this.transitionToRoute('create', {a: 1});
        }
    }
});

and I get an error More context objects were passed than there are dynamic segments for the route: create See code example Ember Twiddle Thank you!