Just started using Meteor so I might be missing something basic. In Meteor 1.2 they have the {{#index}} directive.
In a template if I have:
...
{{#each items}}
{{#index}}
{{> childTemplate}}
{{/each}}
...
<template name="childTemplate">
{{#index}}
</template>
The #index in the main template will work, but the one in the childTemplate won't. The work around I've done to use it is to call the childTemplate passing in #index:
{{> childTemplate #index=#index}}
Is this the correct way to do it? Or is there something more meteory?
Yes, that's fine
There's a similar question I answered here :-
How to get the #index of nested #each in meteor
But in this case passing it in is good.
Meteor has "../var" to get to the parent context, but that is the template context, not the each block, so I don't think there is a more meteory way
Related
I have a template and I would like to pass an additional variable with it's data context:
<template name="list">
{{#each item}}
{{> listItem extraVariable=someValue}}
{{/each}}
</template>
<template name="listItem">
{{extraVariable}}
</template>
I seem to lose the original datacontext (this from the each block) if I do it like in the above snippet. How can I keep the original and still pass the extra information (I do not want to use session variables)
Meteor 1.2 and above:
{{#let x=y}}
let block helper lets you set a new variable without overriding the data context inside the block
More info: https://quip.com/RXFlAk9Rc2xI
I am new to Meteor and got stuck here.
<h1>{{otherObj.category}}</h1>
{{#each partners}}
<p>{{name}} - {{otherObj.category}}</p>
{{/each}}
In this template snippet, otherObj is the object that i want to access in the loop. So this outputs
<h1>football</h1>
<p>Name1 - </p>
<p>Name2 - </p>
Further investigation revealed that OtherObj inside the loop is 'undefined'
Any idea, how can i access it inside the loop ?
You need access to parent properties of each loop.
Use ../ like this :
<h1>{{otherObj.category}}</h1>
{{#each partners}}
<p>{{name}} - {{../otherObj.category}}</p>
{{/each}}
I'm new to Handlebars and I wanted to know if I can use block helper inside a block helper, something like this:
{{#each person}}
{{each family_member}}{{family_relation}}
{{/family_member}}
{{/person}}
I've tried to do it with a simple helpers in http://tryhandlebarsjs.com
and it didn't work, but I couldn't find any place saying if it can work or not....
any help?
Thanks
You can use block helpers inside block helpers. Provided they are used the correct way.
{{#each person}}
{{#each family_member}}
{{family_relation}}
{{/each}}
{{/each}}
You can actually see a plunkr here : http://plnkr.co/edit/H9XlaQG99etHb4Fwx9pp?p=preview
I am using Meteor 0.5.2 and trying to solve what seems to me is an obvious pattern that should have an easy solution.
I have a template that should return different chunk of data in each of template instances.
For example - I have a template showing TV program - show by show.
Then I need to display two instances of the same template with different data - one with past shows and one with upcoming shows.
So I have a tv program template:
<template name="tv_program">
{{#each shows}}
...
</template>
Ideally I would like do something like:
{{> tv_program past_shows}}
...
{{> tv_program upcoming_shows}}
to pass a parameter to tv_program template instance that I can read from JavaScript and adjust the mongo queries.
Currently I have copy/pasted my template/js code and adjusted the mongo queries but there has to be a better way.
I looked into partials/helpers with arguments but that doesn't seem to be the solution to my problem.
Thanks, Vladimir
You're approaching the problem at the wrong level. Rather than trying to tell your code what to do from your templates, you should tell your template what to do from your code. For instance:
Template.past_shows.shows = function() { return shows(-1); }
Template.upcoming_shows.shows = function() { return shows(1); }
function shows(order) {
return Shows.find({}, {$sort: order});
}
<template name="past_shows">
{{#each shows}}
{{> show}}
{{/each}}
</template>
<template name="upcoming_shows">
{{#each shows}}
{{> show}}
{{/each}}
</template>
<template name="show">
<li>{{_id}}: {{name}}</li>
</template>
If you are using a state machine for your app, such as meteor-router, you can use one template and populate it with upcoming or past shows depending on app state.
Is there a variable passed into every handlebar.js template that contains all the context content that is accessible by the template?
e.g. I'm creating a template, but I don't know all the context content accessible by the template. I want to be able to type into the template {{ debug }} and handlebars.js will spit out all the context content into the HTML
You can use the following code to iterate through this object:
{{#each this}}
{{#key}}: {{this}}
{{/each}}
or a similar piece of code iterating through #root object:
{{#each #root}}
{{#key}}: {{this}}
{{/each}}
Handlebars has built-in helper log.
You just need to set logging level to DEBUG.
Handlebars.logger.level = 0;
Then use helper:
{{log this}}
EDIT: Sorry, this will not write context to HTML, helper uses console.log. For outputting to HTML you need to write custom helper that will use for example JSON.stringify.
Though this question is somewhat old, someone might find this usefull. You can just dump the handlebars current context into plain text with;
{{{.}}}