What is the ">" operator in a Meteor Handlebars.js template? - handlebars.js

I have looked through the source of Meteor and Handlebars.js, but couldn't find what > does. Is it a helper? For example in the todos example of Meteor (git):
<div id="lists">
{{#each lists}}
{{> list_item}}
{{/each}}
</div>
Follow up: The handlebars.js Meteor package parses the template and when it finds {{> some_partial}} it places the some_partial template. Take a look at packages/handlebars/parse.js

I'ts a partial call
https://github.com/janl/mustache.js
Whereas in ERB you may have this:
<%= partial :next_more, :start => start, :size => size %>
Mustache requires only this:
{{> next_more}}

Related

meteor spacebars run a helper whose name is available as a string in context

I am using meteor 1.4 for building a real time task assignment app.
I am stuck at a point when i want to include a template passing in an argument the template helper of that template to run.
Now when i pass the argument, it is passed as a string and i want to call that template helper. But i cannot find any way in spacebars to call a template helper when i have the helper name available as a context variable of string type.
Please tell whether it is possible and if yes, then how ??
Thanks in advance
Edit 1 - For ex.
<template name="parent">
{{> children helperParameter="someHelper"}}
</template>
<template name="child">
{{> child2 value=helperParameter }}
</template>
<template name="innerchild">
{{value}}
</template>
So basically, I want to pass the value returned by someHelper to the template innerchild and i want to decide which helper (in this case someHelper) to run in child by passing the name of that helper to child template from parent template.
Now, i can not run that helper in child template where i have its name in parameter helperParameter as a string.
Try Template.dynamic.
<template name="layout">
{{> Template.dynamic template=template}}
<!-- This is equivalent to
{{> nameOfNeededTemplate}}
-->
</template>
Template.layout.helpers({
template: function() {
return 'nameOfNeededTemplate';
}
});

Passing through variable into partial and using an #is helper - Handlebars

I'm trying to pass a variable (tag name) into a Handlebars partial and use an #is block helper on the tag but for some reason it just won't play ball. This is my code:
Call to my partial and passing through the tag name.
{{> nav tagged='page' }}
In the partial itself I do the following (tagged is the variable name passed through):
{{#each tags}}
{{#is tag tagged}}
{{#each pages}}
// Do code here
{{/each}}
{{/is}}
{{/each}}
If I just render the tagged variable it displays the variable value as expected so a bit confused as to why its not working.
Thanks.
The issue you have is that the tagged variable is in the parent context but you're trying to reference it within the #each tags loop.
You can reference the parent context with ../ so the working code would be
{{#each tags}}
{{#is tag ../tagged}}
{{#each pages}}
// Do code here
{{/each}}
{{/is}}
{{/each}}

passing arguments to iron:router pathFor

I'm building a menu in Meteor and missing something in the syntax.
I can only guess it's simple but couldn't find any strait question or answer about this, help appreciated.
So, I have one template to rule dem all:
<template name="navigator">
<div class="navigator">
{{>navButton type="home"}}
{{>navButton type="find"}}
{{>navButton type="account"}}
</div>
</template>
my navButton template looks like this:
<template name="navButton">
<div class="navButton">
<p>
{{#if type}}
<a href="{{pathFor type}}"</a>
{{/if}}
</p>
</div>
</template>
the {{pathFor type}} doesn't work.
How can I simply use the type argument string WITHOUT ANY JAVASCRIPT (of course I'm naming the route and templates using the same name)
update:
i don't want to do this due to an implementation of a security pattern:
{{type}}
If you have the routes already set as my example, you can use
Home
Example of route mapping:
Router.route('/', {
name: 'home'
});

Use a variable as template variable

I have a page header template, which has a title variable like so:
{{> pageHeader title="questions"}}
<template name="pageHeader">
<h1>{{title}}</h1>
</template>
This works fine. But I use i18n to set my titles, like {{i18n 'title'}}.
How can I use this in the template call? When I use this it doesn't work:
{{> pageHeader title="{{i18n 'title'}}"}}
Not yet on master branch of meteor but on develop: https://github.com/meteor/meteor/issues/5066
If you update to the 1.2 release candidate you can already use this feature.
Update to the rc:
meteor update --release METEOR#1.2-rc.10
Use the nested sub-expressions:
{{> pageHeader title=(i18n 'title')}}
You can resolve the i18n in your .js file.
Your template would be
{{> pageHeader title=i18nTitle}}
and you'd have a helper that would solve for the i18n
Template.xxx.helpers({
i18nTitle: function() {
return i18nMethod('title');
}
});

How to render a Meteor Template from Collection of Template names?

I have three simple Templates in Meteor, and a Collection on the server with any combination of their names. I want to be able to render these templates dynamically based on which of their names are in the Collection.
Currently I am trying to accomplish this by using the client to subscribe to the Collection, and access the names through a template function. Unfortunately, if I try to run ">" on the names, Meteor attempts to render the variable name instead of the Template pointed to by its value.
So instead of rendering the html in template1, template2, and template3, the output is merely their names on the page: "template1 template2 template3".
Here is the code I've been using, I hope there's a way to solve my issue without having to run Meteor.render manually.
Server js:
TemplatesToRender = new Meteor.Collection("templatesToRender");
TemplatesToRender.insert({templateName: "template3"});
TemplatesToRender.insert({templateName: "template2"});
Client html:
<body>
{{#each templatesToRender}}
{{> templateName}} // meteor trying to render a template
// called "templateName" instead of the
// variable inside templateName.
{{/each}}
</body>
<template name="template1">
<span>Template 1</span>
</template>
<template name="template2">
<span>Template 2</span>
</template>
<template name="template3">
<span>Template 3</span>
</template>
You can make a render helper:
Handlebars.registerHelper('render', function(name, options) {
if (Template[name])
return new Handlebars.SafeString(Template[name]());
});
And use it with
{{render templateName}}
You might want to try this
in your html
<body>
{{> templateToRender}}
</body>
<template name="templateToRender">
{{! use below to detect which template to render}}
{{#if templateName "template1"}}
{{> template1}}
{{/if}}
{{#if templateName "template2"}}
{{> template3}}
{{/if}}
{{#if templateName "template3"}}
{{> template3}}
{{/if}}
</template
<template name="template1">
<p>this is template1</p>
</template>
<template name="template2">
<p>this is template2</p>
</template>
<template name="template3">
<p>this is template3</p>
</template>
in your script
Template.templateToRender.templateName = (which) ->
# if user have a field like templateName you can do things like
tmplName = Meteor.user().templateName
# Session.equals will cause a template render if condition is true.
Session.equals which, tmplName
Meteor 1.0 just came out today, and I just want to update this for 2014 :)
https://docs.meteor.com/#/full/template_dynamic
{{> Template.dynamic template=template [data=data] }}
Sample Usage:
{{#each kitten}}
{{> Template.dynamic template=kitten_type data=this }}
{{/each}}

Resources