Sharing actions and methods between subroutes in Ember

@Caltor wrote:

I have split my product information into a subroute for each tab as follows:

/product/id (parent route)
/product/id/summary (subroute)
/product/id/details (subroute)
/product/id/log (subroute)
etc

I would like to share some actions and methods between the various subroutes.

For example I currently have the following code that I would have to copy and paste from the summary to details and log controllers.

export default Controller.extend({
  saveCall() {
    // make REST service calls blah de blah
  },
  actions: {
    save() {
      this.set('model.isLoading', true);
      return this.saveCall()
        .finally(() => {
          this.set('model.isLoading', false);
        });
    }
  }
});

I have tried using this.send('save') to “bubble up” the action to the parent controller but I get the message:

An action named ‘save’ was not found in <ui@controller:product/details::ember436>", …

Normally with components I would pass a closure action to the component but as these are controllers on subroutes I can’t see how I can do that.

I have the following ideas for how to get around this:

1. Create a shared base class and extend all the subroute controllers from this base class.
2. Inject the parent controller into the subroute controllers.
3. Create a mixin for the shared code and add that into each subroute controller.
4. Create a service(s) and call this from the actions of each subroute controller. This would still require a set of actions on each subroute controller but each one should hopefully just be a one-liner.

Which of these 4 options or any other is the canonical more “Embery” way to do this please?

Posts: 2

Participants: 2

Read full topic