1

I have a dynamic line of code:

 <label>{{title}}</label>
//template name="header"

I'm using iron:router, the app is super simple right now:

Router.configure({
  layoutTemplate: 'ApplicationLayout'
})

Router.route('/', {
  template: "home"
})

Router.route('/scientific', {
  template: "scientific"
})

I'd like a solution that doesn't rely on Session as a way to dynamically render the {{title}}.

Ideally I'd like to define this title somewhere in my router code, and just have my header automatically pick it up. I don't particularly want to do a lot of Session.set/get over in my Template.rendered callbacks (I seem to get an issue doing this with Semantic-UI checkboxes).

Do you guys have any elegant, super simple solutions?

PS: the template 'header' is in the ApplicationLayout template. The ApplicationLayout has a {{> yield}} below the header.

Keith Dawson
  • 1,475
  • 16
  • 27
ilrein
  • 3,833
  • 4
  • 31
  • 48
  • It deserves a package, did you try to encapsulate all those ugly session sets in a single, easy to use meteor package? – Filipe Borges Feb 20 '15 at 02:09
  • That sounds like a great idea, except I still have much to learn about Meteor itself before I start refactoring into modular code. Maybe I should write a blog with this code more in depth and get feedback from you Meteor wizards on some high quality refactoring. – ilrein Feb 20 '15 at 03:32
  • I assumed you want to change the html > header > title also. For your simple case the answer bellow is good enough. – Filipe Borges Feb 20 '15 at 13:21

1 Answers1

6

A viable option is to store your title inside your route options like this :

Router.route("/",{
  template:"home",
  title:"Welcome Home !"
});

Router.route("/scientific",{
  template:"scientific",
  title:"Scientific stuff"
});

Then you can define a title helper on your header template based on the (reactive) current route controller.

Template.header.helpers({
  title:function(){
    return Router.current().route.options.title;
  }
});
saimeunt
  • 22,666
  • 2
  • 56
  • 61
  • You know what, this was the elegant solution I wanted, but semantic-ui is STILL giving me issues. And I thought it was just a Session thing. Nonetheless, thanks! – ilrein Feb 20 '15 at 03:34
  • 1
    You can create a global helper to provide a reactive `title` (or `pageTitle`) helper to templates [1] and create a Deps.autorun to set the browser page title [2]. See: [1] http://stackoverflow.com/questions/20681761/global-function-for-meteor-template-helper and [2] http://stackoverflow.com/questions/14036248/meteor-setting-the-document-title. You can also pack this in a package. – Filipe Borges Feb 20 '15 at 13:30
  • Why not use the package: [iron-router-title](https://atmospherejs.com/ostrio/iron-router-title) ? – dr.dimitru May 24 '15 at 01:21