handlebars.js | 易学教程

Passing an array of objects to a partial - handlebars.js

阅读更多关于 Passing an array of objects to a partial - handlebars.js

问题 Im trying to pass an array of objects into a partial as an argument: {{> partial [{title: "hello", year: "2015"}, {title: "hello2" year: "2015"}] }} and then on the partial: <div> {{#each this}} <label>{{title}}</label> <label>{{year}}</label> {{/each}} </div> ... but nothing shows up. Is there a way to pass array data to a partial? Thanks in advance. 回答1: Create a helper that parses the JSON and wrap your partial with this context. Template: {{#getJsonContext '[{"title": "hello", "year":

Re-Rendering Handlebars partial from backbone view

阅读更多关于 Re-Rendering Handlebars partial from backbone view

问题 I have a view, which holds handlebars template. that template consist of another partial template. that partial template holds a list of results, which i am using in different parts of my app. anyhow, when trying to filter the results, i'd like to render only that part. meaning the backbone view should not render the whole view just the partial. can it be done? 回答1: Yes, it's possible. The easiest way is to execute the whole template as you do when rendering the complete view, but only

How to use Handlebars ternary helper?

阅读更多关于 How to use Handlebars ternary helper?

问题 Following this answer, I wrote a helper like module.exports.register = function (Handlebars) { Handlebars.registerHelper('ternary', function(test, yes, no) { return test ? yes : no; }); }; I'm certain that the helper is loaded and being defined but can't figure out the syntax to use it. I tried using it like <div>{{ternary(true, 'yes', 'no')}}</div> but that gives an assemble build error Warning: Parse error on line 10: ...<div>{{ternary(true, 'yes', ----------^ Expecting 'ID', 'DATA', got

Is there any method to iterate a map with Handlebars.js?

阅读更多关于 Is there any method to iterate a map with Handlebars.js?

问题 It is easy to iterate an array with Handlebars.js like: {{#each comments}} <div class="comment"> <h2>{{title}}</h2> {{{{url}}} </div> {{/each}} and an array like: { comments: [ { url: "http://www.yehudakatz.com", title: "Katz Got Your Tongue" }, { url: "http://www.sproutcore.com/block", title: "SproutCore Blog" }, ] } But I don't find a method to iterate a map like: { headers: { "Host": "www.example.com", "Location": "http://www.example.com", ... Much more map items ... } } Is there any

event.target is undefined in events

阅读更多关于 event.target is undefined in events

问题 How can one use each input values in events ? Hope my below code will explain you well. HTML: <template name="UpdateAge"> {{#each Name}} <div data-action="showPrompt"> <div> Some content </div> <div> <div> Some content </div> </div> <div> Name : {{name}} Age : <input type="text" name="age" value="{{age}}"/> //I need to access age values in event </div> </div> {{/each}} <template> JS: Template.UpdateAge.events({ 'click [data-action="showPrompt"]': function (event, template) { console.log(event

Ember Interpolation in a href tag in handlebars template

阅读更多关于 Ember Interpolation in a href tag in handlebars template

问题 I am trying to make a simple link to google maps with a dynamic address inserted into the href field. I have tried the code below plus tons of other messing around with no luck. How do you interpolate a dynamic ember string in a handlebars href field? I am using ember,rails, and handlebars. I know how to use bindAttr if I had the entire url stored with my model but I only have the address. Putting the google url with every model seemed unnecessary if i could just call it once in the view. <h1

Example of using Handlebars lookup helper

阅读更多关于 Example of using Handlebars lookup helper

问题 Handlebars has a built-in helper called lookup . The documentation is not very clear about how it works. Could I see an example? 回答1: Sure, past me! Here's an example from your future. Suppose you have an object or array arr and a variable key and you want to output the value of arr[key] , you would use the lookup helper {{lookup arr key}} . The code defining the helper is simply: function(obj, field) { return obj && obj[field]; } 回答2: The lookup property is useful if we don't know the name

Custom for-loop helper for EmberJS/HandlebarsJS

阅读更多关于 Custom for-loop helper for EmberJS/HandlebarsJS

问题 A small two hours ago I started: Nested HandlebarsJS #each helpers with EmberJS not working Shortly after I figured an acceptable temporary solution myself, question is still unaswered. My problems didn't stop there though. I am now trying to make a custom helper which will loop through an array of objects, but exclude the first index - pretty much: for(i = 1; i < length; i++) {} . I've read on websites you have to get the length of your context and pass it to options - considering your

How to truncate string using meteor and handlebars?

阅读更多关于 How to truncate string using meteor and handlebars?

In jinja2(python) template engine there is a simple thing for truncating strings: {{ fooText|truncate(200) }} Does meteor(handlebars) provides something like this? I never use | on spacebars (the engine used on meteor template), but you can do a helper to accomplish this(for example a global Template.registerHelper r). Template.registerHelper('text', function(passedString) { var fooText = passedString.substring(0,1); //same as truncate. return new Spacebars.SafeString(fooText) }); And use it like {{ text myString}} Here we are using some Blaze and the substring method . I am using values as

Re-render handlebars template after ajax response

阅读更多关于 Re-render handlebars template after ajax response

In my handlebars template I have a div to display flash messages like this <div id="flashContainer" class="alert alert-dismissible alert-{{flash.type}}" style="display: {{#if flash}}block {{else}}none{{/if}}"> <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button> <strong>{{flash.intro}}</strong> {{{flash.message}}} </div> After submitting a form with an ajax request I want to set the flash message and then if the request is successful I want to update only this part of the page. However I don't want to manually update the html but I want to re-render the part