Meteor JS Iron Router, route sub directory

Question

I am working on a admin and client portal in Meteor JS using Iron:Router.

I know i can create a route using:

this.route('tasks',{path:'/projects', layoutTemplate: 'adminLayout'});

But is it possible to make a route with a sub directory such as:

this.route('tasks',{path:'/admin/projects', layoutTemplate: 'adminLayout'});

So that way i can also have a sub directory of:

this.route('/admin/projects', {name: 'admin.projects', template: 'projects', layoutTemplate: 'adminLayout'}

and

this.route('/client/projects', {name: 'client.projects', template: 'projects', layoutTemplate: 'adminLayout'}

Thanks for any input.

Socalled

Is that the full error report? Looks like it is only half of the error, if not can you post the full error or screenshot of the error. – Skip

also try changing the name of the routes, for all routes you're using same name tasks , I think route names should be different – Skip

Hi, i have gotten the error to go away, the error log was actually from a duplicate route (admin/client) which is why i would like to differentiate them. But the problem is now that the route will not resolve. Iron:Router recognizes the route, but does not know what template to load thus leaving the page in a loading state with only CSS loaded. – Socalled

And the reason why they all read the template task is just because i copied and pasted them for the post here. They are all going to different templates. FYI. – Socalled

Answer 1

All the paths you have can coexist in one app quite happily. The router (or your browser) doesn't have any concept of directories/subdirectories, all it understands are strings and regular expressions. The nesting is purely something we (should) create to enable ourselves to understand how an app/api(/codebase, etc) is structured.

As Sasikanth points out that is not the full error message. However looking at packages/iron_middleware-stack/lib/middleware_stack.js line 31 it's easy to confirm what is happening:

    throw new Error("Handler with name '" + name + "' already exists.");

This is within the Router.route function, which is documented here.

Router.route('/post/:_id', {
  // The name of the route.
  // Used to reference the route in path helpers and to find a default template
  // for the route if none is provided in the "template" option. If no name is
  // provided, the router guesses a name based on the path '/post/:_id'
  name: 'post.show',

  // To support legacy versions of Iron.Router you can provide an explicit path
  // as an option, in case the first parameter is actually a route name.
  // However, it is recommended to provide the path as the first parameter of the
  // route function.
  path: '/post/:_id',

  // If we want to provide a specific RouteController instead of an anonymous
  // one we can do that here. See the Route Controller section for more info.
  controller: 'CustomController',

  // If the template name is different from the route name you can specify it
  // explicitly here.
  template: 'Post',

  // and more options follow

So for the code you included above, you provide explicit paths. Therefore the first parameter is the route name. These must be unique as they are used to lookup the path in the pathFor, urlFor and linkTo helpers. As you are not providing an explicit template option, the name is also used for that, but your code is throwing this exception before it gets that far.

I think what you were trying to achieve is this:

this.route('/projects', {name: 'projects', template: 'tasks',  layoutTemplate: 'adminLayout'});
this.route('/admin/projects', {name: 'admin.projects', template: 'tasks', layoutTemplate: 'adminLayout'});
this.route('/client/projects', {name: 'client.projects', template: 'tasks', layoutTemplate: 'adminLayout'});

Hurlee

Hi, please disreagre the console error completely, the error is from a duplicated route the was not posted as i mentioned in earlier comments. You are correct on what i an trying to achieve which i already have corrected, but the app gets stuck in a loading phase after CSS is loaded. I have already changed my code to: this.route('/admin/projects', {name: 'admin.projects', template: 'projects', layoutTemplate: 'adminLayout'} – Socalled

You should probably configure the router to use your layout with Router.configure({ layoutTemplate: 'adminLayout' }); Also for the sake of simplicity remove the name attribute for now. Consider reversing your naming convention as well i.e. have it be /projects/admin and /projects/client. As for the actual problems you are having, try making sure that you have only one template named tasks in all of your project files, sometimes duplication sneaks in and leads to weird errors. If that doesn't help, we might need you to paste some of the errors in the console or meteor server. – Hager

Also just noticed, but you are doing this.route instead of Router.route - which I think was deprecated a couple of versions back - refer to the official entry guide to Iron-Router – Hager