Meteor Iron Router not loading template

Question

I am trying to load templates using iron router and none of the templates for the routes load. The url will change when the items are clicked but the current page never changes.

Lib/router.js -

Router.configure({
  // we use the  appBody template to define the layout for the entire app
  layoutTemplate: 'appBody',

  // the appNotFound template is used for unknown routes and missing lists
  notFoundTemplate: 'appNotFound',

  // show the appLoading template whilst the subscriptions below load their data
  loadingTemplate: 'appLoading',

  // wait on the following subscriptions before rendering the page to ensure
  // the data it's expecting is present
  waitOn: function() {
    return [
      Meteor.subscribe('users'),
      Meteor.subscribe('roles')
    ];
  }
});

dataReadyHold = null;

if (Meteor.isClient) {
  // Show the loading screen on desktop
  Router.onBeforeAction('loading', {except: ['join', 'signin']});
  Router.onBeforeAction('dataNotFound', {except: ['join', 'signin']});

}

Router.map(function () {
  Router.route('home', {
    path: '/',
    onBeforeAction: function() {
      this.next();
    },
    action: function() {
      this.render('home');
    }
  });
  Router.route('adminPanel', {
    path: 'adminPanel',
    onBeforeAction: function() {
      this.next();
    },
    action: function() {
      console.log("hit admin");
      this.render('adminPanel');
    }
  });

});

The two links:

            <li>
                <a href="/"><i class="fa fa-home"> Home</i></a>
            </li>
            <li>
                <a href="/adminPanel"><i class="fa fa-users"> Administration Panel</i></a>
            </li>

The 'home' template is very basic:

<template name="home">
<h1>Welcome </h1>
<h2>Site in development</h2>
</template>

The 'adminPanel' template:

<template name="adminPanel">
  <h1><i class="fa fa-users"> Administration Panel</i></h1>
    {{> addUserModal}}
    {{> tabular id="userTable" table=TabTables.Users class="table table-striped table-bordered table-condensed"}}
    {{> addRoleModal}}
    {{> tabular id="userTable" table=TabTables.Roles class="table table-striped table-bordered table-condensed" }}
    {{> autoformModals}}
</template>

Here is the file structure if it helps:

.
├── client
│   ├── head.html
│   ├── routers
│   └── templates
│       ├── adminPanel.css
│       ├── adminPanel.html
│       ├── adminPanel.js
│       ├── app-not-found.html
│       ├── app-not-found.import.less
│       ├── appBody.html
│       ├── home.html
│       ├── loading.html
│       └── loading.import.less
├── lib
│   └── router.js
├── public
│   └── images
└── server
    └── publish.js

Answer 1

Your call to the Router.map function is unnecessary. It doesn't do much, as you can see here.

Also you can omit the onBeforeAction hook if you're just calling this.next().

But I too, don't see anything wrong with your code. Here are some things you could try tho:

• Check if your subscriptions are working properly
• Make sure your calling > yield in your layout
• Check for errors in your appLoading template