Mustache.js use Basic (iii)

Zccst

The main points of this section are Submodules (partials) and separators (delimiter), etc.

1, sub-module (partials)

/*{{>partials}} starts with > to represent Submodules, such as {{> address}}, and when the structure is more complex, we can use this syntax to split a complex structure into several small sub-modules, such as:*/vardata = {    "Company": "Apple",    "Address": {        "Street": "1 Infinite Loop cupertino</br>",        "City": "California",        "State": "CA",        "Zip": "95014"    },    "Product": ["Macbook", "IPhone", "IPod", "IPad"]}//Main templatevarTPL = ";//sub-template notation 1: Define a child module object. Put sub-templates inside. varPartials ={address:"{{#address}}<li>{{street}}</li><li>{{city}}</li><li>{{state}}</li><li >{{zip}}</li>{{/address}} "}varHTML =Mustache.render (TPL, data, partials);//Sub-template notation 2: Write directly in the third parametervarhtml = Mustache.render (TPL, data, {address: "{{#address}}<li>{{street}}</li><li>{{city}}</li ><li>{{state}}</li><li>{{zip}}</li>{{/address}} "});d Ocument.getelementbyid ("Target"). InnerHTML = html;

One more example:

var view = {    "Joe",    winnings: {        +}    }; var template = "Welcome, {{name}}! {{#winnings}} {{>winnings}} {{/winnings}} "var partials = {    " you just won ${{value}} "; var output = mustache.to_html (template, view, partials);d Ocument.getelementbyid ("target"). InnerHTML = output;

The output is:

Welcome, joe! You just won $1000

2, delimiter (delimiter)

(1) Notation 1: Default label style

* {{default_tags}}
{{=<%%>=}}

(2) Notation 2: Using the Erb style
* <% Erb_style_tags%>
<%={{}}=%>

(3) Notation 3:
* {{Default_tags_again}}

3, pre-parse or cache parse

The mustache.js will be cached the first time the template is read, and the second can speed up if needed

Mustache.pars (template);

Mustache.render (template, view);

4, the corresponding plug-in

There are jquery,mootools,dojo,yui,qooxdoo. You can use rake to built.

5, Test (unit test and overall test)