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

Can we see the templates themselves? Are they named properly? Also you can utilize iron routers paths, For instance href="{{pathFor 'home'}}" is the recommended way to utilize the path for a route. — cwahlfeldt
No error shows up in console. When using the `href="{{pathFor 'home'}}" do I still need the functions in router.js? — Nighthawk
I have added the templates and file structure to the original question. — Nighthawk

halbgut halbgut · Accepted Answer · 2015-06-15T18:58:11

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

Meteor Iron Router not loading template

1 Answers