In my router.js file, I have something that looks like the following
import EmberRouter from '@ember/routing/router';
const Router = EmberRouter.extend({});
Router.map(function () {
this.route('index', { path: '/' });
this.route('foo', function() {
this.route('bar', function() {
this.route('cat');
});
});
this.route('notfound', { path: '/*path' });
});
export default Router;
The problem is that I want the path /foo/bar/cat
to route to the foo.bar.cat
route, but I don't want the paths /foo
or /foo/bar
to route to anything except a 404. In my case, the foo
and bar
routes are essentially useless. I just want the url to have 3 levels for aesthetic purposes.
I actually realized what made more sense was to just avoid creating foo
and bar
routes and create a path for the route I wanted.
So instead of doing this in ember-cli:
ember g route foo/bar/cat
I just did
ember g route cat
And then I set the desired path in the router.
Router.map(function () {
this.route('index', { path: '/' });
this.route('cat', { path: '/foo/bar/cat'});
this.route('notfound', { path: '/*path' });
});
That gives me the correct route for foo/bar/cat
, but foo
and foo/bar
both get routed to the notfound
route.