EzDevInfo.com

mustache.js

Minimal templating with {{mustaches}} in JavaScript {{ mustache }}

How do I accomplish an if/else in mustache.js?

It seems rather odd that I can't figure how to do this in mustache. Is it supported?

This is my sad attempt at trying:

    {{#author}}
      {{#avatar}}
        <img src="{{avatar}}"/>
      {{/avatar}}
      {{#!avatar}}
        <img src="/images/default_avatar.png" height="75" width="75" />
      {{/avatar}}
    {{/author}}

This obviously isn't right, but the documentation doesn't mention anything like this. The word "else" isn't even mentioned :(

Also, why is mustache designed this way? Is this sort of thing considered bad? Is it trying to force me to set the default value in the model itself? What about the cases where that isn't possible?


Source: (StackOverflow)

What's the advantage of Logic-less template (such as mustache)?

Recently, I ran into mustache which is claimed to be Logic-less template.

However, there is no explaining why it is designed in Logic-less way. In another word, what's the advantage of Logic-less template?


Source: (StackOverflow)

Advertisements

Can mustache iterate a top-level array?

My object looks like this:

['foo','bar','baz']

And I want to use a mustache template to produce from it something like this:

"<ul><li>foo</li><li>bar</li><li>baz</li></ul>"

But how? Do I really have to munge it into something like this first?

{list:['foo','bar','baz']}

Source: (StackOverflow)

In Mustache, How to get the index of the current Section

I am using Mustache and using the data

{ "names": [ {"name":"John"}, {"name":"Mary"} ] }

My mustache template is:

{{#names}}
    {{name}}
{{/names}}

What I want to be able to do is to get an index of the current number in the array. Something like:

{{#names}}
    {{name}} is {{index}}
{{/names}}

and have it print out

John is 1
Mary is 2

Is it possible to get this with Mustache? or with Handlebars or another extension?


Source: (StackOverflow)

jQuery + client-side template = "Syntax error, unrecognized expression"

I just updated jQuery from 1.8.3 to 1.9, and it started crashing all of a sudden.

This is my template:

<script type="text/template" id="modal_template">
    <div>hello</div>
</script>

This is how I read it:

modal_template_html = $("#modal_template").html();

This is how I transform it into jQuery object (I need to use jQuery methods on it):

template = $(modal_template_html);

... and jQuery crashes!

Error: Syntax error, unrecognized expression: <div>hello</div>

slice.call( docElem.childNodes, 0 )[0].nodeType;

jquery-1.9.0.js (line 3811)

However, if I declare template as a plain text variable, it starts working again:

var modal_template_html = '<div>hello</div>';

Can anyone help me to figure this out?

UPDATE: Jquery team heard and changed things back to normal in 1.10:

The biggest change you’re likely to see is that we’ve loosened up the criteria for HTML processing in $(), allowing leading spaces and newlines as we did before version 1.9


Source: (StackOverflow)

Is it possible to have nested templates in Go using the standard library? (Google App Engine)

How do I get nested templates like Jinja has in the python runtime. TBC what I mean is how do I have a bunch of templates inherit from a base templates, just filing in blocks of the base templates, like Jinja/django-templates does. Is it possible using just html/template in the standard library.

If that is not a possibility, what are my alternatives. Mustache seems to be an option but would I then be missing out on those nice subtle features of html/template like the context sensitive escaping etc.? What other alternatives are ther?

(Environment: Google App Engin, Go runtime v1, Dev - Mac OSx lion)

Thanks for reading.


Source: (StackOverflow)

How to set a selected value in a dropdown list using Mustache.js?

Is it possible to do this with Mustache.js?

var data = {"val":"3"},
    template = '<select>' +
                    '<option value="1">1</option>' +
                    '<option value="2">2</option>' +
                    '<option value="3">3</option>' +
                '</select>';

var html = Mustache.to_html(template, data);

$(html).appendTo('body');

Source: (StackOverflow)

Single page Web App in Java framework or examples? [closed]

Has anyone seen an example or done the following in Java: http://duganchen.ca/single-page-web-app-architecture-done-right/

That is a design a single page web app that will work with Google SEO with out massive violation of DRY using Java technologies?

It doesn't seem terrible hard to do this on my own but I was curious (and lazy) to see if someone had already done it with either Spring or JAX-RS.


Source: (StackOverflow)

Is there a mustache template syntax highlighter or plugin for Eclipse?

I'm looking for a Mustache template syntax highlighter / plugin in Eclipse

Does one exist? I don't seem to be finding anything on google, and I don't know how to write my own for Eclipse.


Source: (StackOverflow)

How do I use nested iterators with Mustache.js or Handlebars.js?

I would like to use handlebars.js or mustache.js to iterate over a list of families, and then iterate over that family's members. Inside of both loops, I want to display properties of both. However, once I get into the second iteration, none of the family variables are visible.

{{#each families}}
  {{#each members}}
    <p>{{ ( here I want a family name property ) }}</p>
    <p>{{ ( here I want a member name property ) }}</p>
  {{/each}}
{{/each}}

Is this possible? I'd greatly appreciate any help!


Source: (StackOverflow)

What are the pros/cons of using mustache with Backbone.js?

I'm learning backbone.js for a Rails 3 application I'm working on. Backbone uses underscore which, I believe, has its own template engine built in.

I've read good things about mustache but was wondering if I should consider using it instead of the built in template engine of underscore?

What are your thoughts?

Thanks


Source: (StackOverflow)

mustache.js vs. jquery-tmpl

I'm looking at javascript templating for the first time and mustache and jquery-tmpl are the top contenders at the moment.

Some of my requirements:

  • templates will live in separate files to be included on multiple pages
  • all (or almost all) data will come from calls to a restful api which returns json
  • we're a java/eclipse shop, so syntax highlighting and compatibility with that would be nice, if it's an issue at all

Anyone know of any comparisons in terms of speed, ease of use, flexibility, stability? Any other factors I should be considering? Other top templating engines?

(I know there are other questions on this general topic, but I don't see any direct, broad comparisons between these two.)


Source: (StackOverflow)

How to do advanced i18n with Mustache.js?

It seems Twitter is using a fork of Mustache.js to provide i18n to its templates?

Could someone give a brief example of how this is done and perhaps also outline what semantics is necessary to crowdsource these translations?

There is of course this simple example:

var template = "{{_i}}{{name}} is using mustache.js!{{/i}}"

var view = {
  name: "Matt"
};

var translationTable = {
  // Welsh, according to Google Translate
  "{{name}} is using mustache.js!": "Mae {{name}} yn defnyddio mustache.js!"
};

function _(text) {
  return translationTable[text] || text;
}

alert(Mustache.to_html(template, view));
// alerts "Mae Matt yn defnyddio mustache.js!"

But I'd like some more insight on how to structure the _(text) function and translationTable to provide conditionals, singular, plural etc. Examples of solving more advanced use cases would be much appreciated.


Source: (StackOverflow)

DOM tree based JavaScript template engines

I am looking for a new Javascript template engine to replace old jQuery Template for my client side templating needs.

I'd prefer approach where the template engine deals with DOM trees instead of text strings and later dumps the content of the cooked string into innerHTML. This is better performance wise and I find DOM manipulation more proper way of constructing more of DOM tree.

What options I do have for Javascript template engine which would directly create DOM trees instead of being text based engines? I like Mustache.js's logicless approach, but it seems to operate on strings only. Native jQuery integration would also be a nice feature.


Source: (StackOverflow)

Django and Mustache use the same syntax for template

I try to smuggle HTML template in the HTML for mustache.js, however the django template engine remove all the placeholders that should be output as-is to the front-end

The template is included in HTML in this way:

<script type="text/x-mustache-template" data-id="header_user_info">
    <div id="header_user_info">
        <div id="notification">0</div>
        <a rel='nofollow' href="#">{{username}}</a>
    </div>
</script>

and I can get the HTML template by running $(el).html(), and generate html by using Mustache.to_html(temp, data);

I could put all the template into another static file and serve from CDN, but then it would be hard to track where the template belongs, and at least one extra http request.


Source: (StackOverflow)