Handlebars Document Notes

Handlebars compatible mustache templates.

Compared to several node. js commonly used templates, what EJS, Jade and so on, or feel handlebars more comfortable, template only to do data display, the front-end logic of things through helper implementation, HTML is not doped too much js things, look neat some.

Introduction of the handlebars template in Express requires the introduction of the HBS module

Handlebars-expression

 
Find the Title property in context and get its value

Point split expression

 
The current context to find the article property, and then find its Title property

The identifier can be a Unicode character other than the following characters whitespace! ' #% & ' () * +,. / ; < = > @ [\] ^ ' {|} ~

Illegal identifiers are wrapped in "[]"

{{#each articles.} [10]. [#comments]}} 
Do not escape

{{{foo}}}
 
Helpers

0 or more parameters, separated by a space, each parameter is a handlebars expression

{{{link story}}}
 
Link is the helper name and story is the helper parameter.

Register Helper

Handlebars.registerhelper (' link ', function (object) {return new handlebars.safestring ("<a href= '" + Object.url + "' &G t; "+ Object.text +" </a> "); });
Helper returns HTML, does not want to be escaped, uses handlebars.safestring ().

Helper takes the received context as the this context

<ul> {#each Items}} <li>{{agree_button}}</li> {{/each}} </ul>
Context and helper:

var context = {items: [{name: ' Handlebars ', Emotion: ' Love '}, {name: ' Mustache ', emotion: ' Enjoy '}, {name: ' Ember ', Emot Ion: "Want to Learn"}]};
Handlebars.registerhelper (' Agree_button ', function () {return new handlebars.safestring ("<button>i agree. I "+ this.emotion +" "+ THIS.name +" </button> ");});
Output Result:

<ul> <li><button>i agree. I Love handlebars</button></li> <li><button>i agree. I enjoy mustache</button></li> <li><button>i agree. I want to learn ember</button></li> </ul>
You can also pass string arguments directly

{{link ' see more ... ' Story.url}}}
 
Equivalent to

{{{link story.text Story.url}}}
 
Handlebars.registerhelper (' link ', function (text, URL) {return new handlebars.safestring ("<a href= '" + URL + "' >" + Text + "</a>"); });
Helper the last parameter can also receive an optional key-value pair sequence (the hash parameter mentioned in the document)

{{"link" see more ... "Href=story.url class=" Story "}}}
 
The key of the hash parameter must be a simple identifier, value is a handlebars expression, and value can be a simple identifier, a path, or a string.

Handlebars.registerhelper (' link ', function (text, options) {var attrs = [];