Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

A good way to define default rendering templates in FlowRouter

When migrating to a new Meteor project which was replacing Iron-Router with Flow-Router, I really missed the functionality of Iron-Router to define default behaviours and settings that were usable globally.

I understand Flow-Router uses the "group" construct to be able to define default hook events which can be applied to any route attached to that group, but there seemed to be nothing available for defining default templates.

What is the best way to implement this type of default global or group template feature?

like image 998
robertdavid Avatar asked Dec 03 '25 17:12

robertdavid


1 Answers

I decided to use a simple abstraction which would allow simulation of this feature of Iron-Router. I am trying evaluate whether or not this is a sound and extensible pattern, before I look into more direct integration of such a feature within FlowRouter itself, and also to share this idea with others who are looking for a similar solution.

I simply created an object which is used as a parameter object template which is modified as needed and then passed when calling BlazeLayout.render.

This is what routes.js might look like:

var appRouteGroup = FlowRouter.group({
  name: "appRouteGroup",
  triggersEnter: [sometrigger]
});

var appRouteTemplates = {
  menuMain: "appNav",
  footerMain: "appFooter"
};

appRouteGroup.route("home", {
  name: "home",
  action: function () {
    // We get the default templates
    var templates = appRouteTemplates;

    // Now we can add the route specific template
    templates.content = "homePage";

    // Then render with templates passed through the object param
    BlazeLayout.render("mainLayout", templates);
  }
});

This will then allow you to render the default group templates without having to redefine them for every route. And with template markup as follows:

<template name="mainLayout">
  {{>Template.dynamic template=menuMain}}

  {{>Template.dynamic template=content}}

  {{>Template.dynamic template=footerMain}}
</template>

I'm looking for a way to maybe make a more direct integration within FlowRouter, but this seems perfectly functional. Any thoughts for improvements?

like image 69
robertdavid Avatar answered Dec 06 '25 08:12

robertdavid