Ad

How To Reuse Routes In Ember 2?

We have fairly complex component - UserProfile.

This component has a number of tabs each with multiple tabs on their own. This results in generating about 20-25 routes for just this component.

Now this component can be visited by multiple routes.

It seems the only way to implement this is to literally copy/paste the routes/templates for UserProfile in every single parent route.

Is it possible to somehow reuse the routes of UserProfile across multiple parents?

Update:

Sample code.

Here userdetail route is child of both list and board.

Currently we will have to copy/paste the router & template files for userdetail under both list and board folders.

Router.map(function() {
  this.route('list', function() {
    this.route('userdetail',{ path: ':id' });
  });
  this.route('board', function() {
    this.route('userdetail',{ path: ':id' });
  });
});
Ad

Answer

This is currently not possible in Ember unfortunately. The only thing you can do to reduce the duplication is to make use of mixins and partials for the duplicated routes/templates/controllers/etc.

I'm also facing this problem several times in apps I'm building and it gets really messy when you have a lot of duplicate child routes.

Ad
source: stackoverflow.com
Ad