handlebars.js

Iterating over basic “for” loop using Handlebars.js

房东的猫 提交于 2019-11-26 11:58:12
问题 I’m new to Handlebars.js and just started using it. Most of the examples are based on iterating over an object. I wanted to know how to use handlebars in basic for loop. Example. for(i=0 ; i<100 ; i++) { create li\'s with i as the value } How can this be achieved? 回答1: There's nothing in Handlebars for this but you can add your own helpers easily enough. If you just wanted to do something n times then: Handlebars.registerHelper('times', function(n, block) { var accum = ''; for(var i = 0; i <

Access a variable outside the scope of a Handlebars.js each loop

扶醉桌前 提交于 2019-11-26 11:48:54
问题 I have a handlebars.js template, just like this: {{externalValue}} <select name=\"test\"> {{#each myCollection}} <option value=\"{{id}}\">{{title}} {{externalValue}}</option> {{/each}} </select> And this is the generated output: myExternalValue <select name=\"test\"> <option value=\"1\">First element </option> <option value=\"2\">Second element </option> <option value=\"3\">Third element </option> </select> As expected, I can access the id and title fields of every element of myCollection to

Using pre-compiled templates with Handlebars.js (jQuery Mobile environment)

冷暖自知 提交于 2019-11-26 11:45:20
问题 I am struggling somewhat with pre-compilation of templates in Handlebars. My jQuery Mobile project is getting pretty big template-wise and I wish to pre-compile the templates I use. However I can\'t seem to find a good explanation (like a step by step tutorial) of how to do this with Handlebars. I still have my templates all inline using the script tags. I have handlebars installed using NPM. But now I am kinda lost in how to proceed. I am guessing doing something like handlebars -s event

Handlebars.js if block helper ==

孤街醉人 提交于 2019-11-26 11:10:56
问题 How would you change the following code to make it work? The problem is the this == \'some message\' expression: <ul> {{#each errors}} {{#if (this == \'some message\') }} <li>Status</li> {{else}} <li>{{this}}</li> {{/if}} {{/each}} </ul> 回答1: The easiest thing would be to add a custom if_eq helper: Handlebars.registerHelper('if_eq', function(a, b, opts) { if(a == b) // Or === depending on your needs return opts.fn(this); else return opts.inverse(this); }); and then adjust your template: {{#if

Insert html in a handlebar template without escaping

徘徊边缘 提交于 2019-11-26 10:25:49
问题 Is there a way to insert a string with html tags into a handlebars template without getting the tags escaped in the outcoming string? template.js: <p>{{content}}</p> use the template HBS.template({content: \"<i>test</i> 123\"}) actual outcome: <p><i>test</i> 123</p> expected result: <p><i>test</i> 123</p> 回答1: Try like <p>{{{content}}}</p> I got the official reference to support my answer: Handlebars HTML-escapes values returned by a {{expression}} . If you don't want Handlebars to escape a

Passing variables through handlebars partial

岁酱吖の 提交于 2019-11-26 06:58:53
问题 I\'m currently dealing with handlebars.js in an express.js application. To keep things modular, I split all my templates in partials. My problem : I couldn\'t find a way to pass variables through an partial invocation. Let\'s say I have a partial which looks like this: <div id=myPartial> <h1>Headline<h1> <p>Lorem ipsum</p> </div> Let\'s assume I registered this partial with the name \'myPartial\'. In another template I can then say something like: <section> {{> myPartial}} </section> This

How to get index in Handlebars each helper?

穿精又带淫゛_ 提交于 2019-11-26 06:54:36
问题 I\'m using Handlebars for templating in my project. Is there a way to get the index of the current iteration of an \"each\" helper in Handlebars? <tbody> {{#each item}} <tr> <td><!--HOW TO GET ARRAY INDEX HERE?--></td> <td>{{this.key}}</td> <td>{{this.value}}</td> </tr> {{/each}} </tbody> 回答1: In the newer versions of Handlebars index (or key in the case of object iteration) is provided by default with the standard each helper. snippet from : https://github.com/wycats/handlebars.js/issues/250

Handlebars.js parse object instead of [Object object]

北战南征 提交于 2019-11-26 06:36:18
问题 I\'m using Handlebars templates and JSON data is already represented in [Object object], how do I parse this data outside of the Handlebars? For example, I\'m trying to populate a JavaScript variable on the page through a handlebars tag, but this doesn\'t work. Any suggestions? Thank you! EDIT: To clarify, I\'m using ExpressJS w/ Handlebars for templating. In my route, I have this: var user = {} user = {\'id\' : 123, \'name\' : \'First Name\'} res.render(\'index\', {user : user}); Then in my

Access properties of the parent with a Handlebars &#39;each&#39; loop

醉酒当歌 提交于 2019-11-26 04:37:38
问题 Consider the following simplified data: var viewData = { itemSize: 20, items: [ \'Zimbabwe\', \'dog\', \'falafel\' ] }; And a Handlebars template: {{#each items}} <div style=\"font-size:{{itemSize}}px\">{{this}}</div> {{/each}} This won\'t work because within the each loop, the parent scope is not accessible -- at least not in any way that I\'ve tried. I\'m hoping that there\'s a way of doing this though! 回答1: There are two valid ways to achieve this. Dereference the parent scope with ../ By

Handlebars/Mustache - Is there a built in way to loop through the properties of an object?

狂风中的少年 提交于 2019-11-26 01:06:11
问题 As the title of question says, is there a mustache/handlebars way of looping through an object properties? So with var o = { bob : \'For sure\', roger: \'Unknown\', donkey: \'What an ass\' } Can I then do something in the template engine that would be equivalent to for(var prop in o) { // with say, prop a variable in the template and value the property value } ? 回答1: Built-in support since Handlebars 1.0rc1 Support for this functionality has been added to Handlebars.js, so there is no more