handlebars.js | 易学教程

Unable to loop through nested JSON array ( uppercase properties ) with Handlebars JS with Ember JS

阅读更多关于 Unable to loop through nested JSON array ( uppercase properties ) with Handlebars JS with Ember JS

I am learning Ember JS and Handlebars JS so I am very new to this. I am having an issue trying to loop through nested JSON array's. I am unable to loop through the 'Pages" in the JSON below. Here is the JSON: { "Pages": [ { "Id": 1, "Name": "Page 1", "Objects": [ { "Width": 100, "Height": 200, "Type": "Shape" }, { "Width": 150, "Height": 250, "Type": "Image" } ] }, { "Id": 2, "Name": "Page 2", "Objects": [ ] } ], "Settings": { "URL": "http://THEURL", "Location": true, "Navigation": true }, "Id": 1, "Title": "The Title", "Description": "The Description" } This is my handlebars template: <script

Passing a function into a Handlebars template

阅读更多关于 Passing a function into a Handlebars template

I'm using (or at least starting with) HandlebarsJS for the html templates but I might have hit a dead end. What I want is to pass a function to the template, e.g. <div id="divTemplate"> <span onclick="{{func}}">{{text}}</span> </div> and then I would expect to have something like var source = $('#divTemplate').html(); var template = Handlebars.compile(source); var data = { "text": "Click here", "func": function(){ alert("Clicked"); } }; $('body').append(template(data)); But the function is executed on init, it is not passed into the template and the result is: <span onclick="">Click here</span

How to outsource a template js to a different file when using Handlebars.js

阅读更多关于 How to outsource a template js to a different file when using Handlebars.js

I have this template script <script id="some-template" type="text/x-handlebars-template"> {{#users}} {username} {email} </script> I want to out-source it to a file called "user_template.js" which will look like this: {{#users}} {username} {email} and make in the main index.html this link: <script id="some-template" type="text/x-handlebars-template" src="user_template.js"></script> The problem is - it doesn't work - how do I do it? You can use ajax to load the template file. With jQuery: $.get("user_template.js", function(template_text){ var template = Handlebars.compile(template_text); // more

How can I determine the MD5 digest of a given asset in the Rails asset pipeline?

阅读更多关于 How can I determine the MD5 digest of a given asset in the Rails asset pipeline?

I'm writing a Javascript-rich application in a Ruby on Rails 3.1 project and using Handlebars for my JS templating framework. I'm trying to figure out a way to dynamically append the MD5 digest of an asset (generated during asset precompilation on production) to my tags inside of my Handlebars template. I'm hoping that there's a hash with the asset path as the key and the MD5 digest as the value, but I haven't been able to find one. An ideal solution would be passing the hash from Ruby into Javascript and defining a Handlebars helper that would automatically append the MD5 digest to the "src"

node.js and Handlebars: HTML compiled is escaped

阅读更多关于 node.js and Handlebars: HTML compiled is escaped

Im using handlebars in a node aplication, and I have trouble. This is the template index.html {{CONTENT}} This is the code var fs = require("fs"); var handlebars = require("handlebars"); var data = { CONTENT: "<b>Hello world!</b>" }; var templateFile = fs.readFileSync('./index.html', 'utf8'); var template = handlebars.compile( templateFile ); var html = template(data); The problem is that the tags <B> are escaped to <B> How can I avoid this? From handlebarsjs.com : Handlebars HTML-escapes values returned by a {{expression}}. If you don't want Handlebars to escape a value, use the "triple-stash

TypeError applying precompiled Handlebars templates with a context

阅读更多关于 TypeError applying precompiled Handlebars templates with a context

Pardon the noob question but I simply can't get precompiled Handlebars templates to do anything but barf out TypeError: 'undefined' is not a function (evaluating 'templateSpec.call(container, Handlebars, context, options.helpers, options.partials, options.data)') each time I apply a context to a (precompiled) template. Given the following files and contents: hello.handlebars : <p>Hello, {{name}}</p> templates.js : the result of compiling hello.handlebars via handlebars hello.handlebars -f templates.js index.html : includes Handlebars RC1 runtime in the head and this for the body: <body id=

Set the selected item in a select list based on template value

阅读更多关于 Set the selected item in a select list based on template value

How can you correctly pre-populate a select control with the current value from the template? I have a simple form to edit a record where the values for the selected record are pre-populated when the form is shown. A bit like this: <input type="text" id="project_name_edit" value="{{selected_name}}"> But where I am using a select control I need to be able to interogate the template value and conditionally set the selected='selected' property for the correct option. <select id="project_status_edit" value="{{selected_status}}"> <option>GOOD</option> <option>BAD</option> <option>UGLY</option> <

How can I yield multiple pieces of content into an ember.js component template?

阅读更多关于 How can I yield multiple pieces of content into an ember.js component template?

The goal is to define a structure of HTML that has more than one block of content that is declared by the caller. For example, a header, body, and content. The resulting markup should be: <header>My header</header> <div class="body">My body</div> <footer>My footer</footer> The template instantiating the component would define each of the three sections, My header , My body , and My footer . With Ruby on Rails, you would use content_for :header to capture the header content from the caller, and yield :header to interpolate it. Is this possible in ember.js? As of ember v1.10, yield accepts

How do I precompile partials for handlebars.js?

阅读更多关于 How do I precompile partials for handlebars.js?

问题 I'm using handlebars.js and I want to start precompiling everything, but I can't seem to find a way to precompile the partials. The majority of my templates are actually partials. I tried just treating my them like regular templates, but then calling them as a partial doesn't work. Is there any way to precompile partials, or, alternatively, call one template from within another template? 回答1: I found an even better method: precompile all your partials as templates, then right before you use

Sort Select Options by Value Attribute Using jQuery

阅读更多关于 Sort Select Options by Value Attribute Using jQuery

Well, the title says it all. What I am doing is creating a featured product module. The drop down list of sizes is populated using JSON and I am using handlebars to render the html. I do not have control over the JSON file. I tried sorting the option values by the actual text within the option tags, but I realized that the option values were wrong after that. So now I am trying to sort the options by their value attributes, but haven't figured it out yet. I am trying to do something like this: var selectList = $('#featuredSelectField option'); var newList = []; var theNewNew = []; for(var i=0;

订阅 handlebars.js