Is it possible to make a parent route a 404, but the child route a specific route

Question

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.

Answer 1

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.