Change Body Class Based On URL in Meteor

Question

I have a template named layout in my app. Inside has:

Basically what I want to ach

Answer 1

You shold modify DOM elememts in onRendered like this:

Template.layout.onRendered(function() {
  // get the current route name (better than checking window.location)
  var routeName = Router.current().route.getName();

  // add the class to body if this is the correct route
  if (routeName === 'myRoute')
    $('body').addClass('blue');
});

Template.layout.onDestroyed(function() {
  // remove the class to it does not appear on other routes
  $('body').removeClass('blue');
});

---

An alternative (and probably easier) solution is just to use a helper on your body template:

Template.body.helpers({
  klass: function() {
    if (Router.current().route.getName() === 'myRoute') {
      return 'blue';
    }
  }
});

Then your body could look like this: