razor-style template engine for JavaScript. node.js & browser are supported.
using with node.js or browserify
$ npm i razor-tmpl --save
using in browser with a script tag
refer from GitHub
<script src="https://rawgit.com/magicdawn/razor-tmpl/master/browser/razor-tmpl.js">
</script>
direct download
dist file locates in browser/
directory
razor-tmpl.js
razor-tmpl.min.js
Note: legacy browsers need ES5 support,see es5-shim
var razor = require('razor-tmpl');
var template = '@{ var name = "zhangsan"; } name is @name , age is @age .';
var locals = {
age: 18
};
console.log(razor.render(template,locals));// name is zhang, age is 18
age
is passed by locals
, can be referenced as @age
or @locals.age
.locals
can be configed via razor.localsName
, such as razor.localsName = "model";
then use @model.age
string interpolation
@locals.someProperty
@someProperty
@(locals.someProperty)
@(someProperty)
@(- someProperty) // - means escape
NOTE: @someProperty
matched with /^([\w\._\[\]])+/
control flow
if else
@if(true){
some-template
}
@if(false){
some-template
} else {
other-template
}
@if(false){
case1-template
} else if(false){
case2-template
} else {
case3-template
}
loop
@for(var i = 0,len=locals.someArray.length;i<len;i++){
<div>@(locals.someArray[i])</div>
}
@* @each is same to @for loop *@
@each(item in locals.someArray){
<div>@item</div>
}
@while(locals.val > 0){
@locals.val
@{
locals.val--;
}
}
code block
@{
// here is some code
// as you see in @while(){ locals.val--; }
}
comment
@{
// code-block is normal js
/* so whatever is OK */
}
@* it's a razor comment and will not be in the output *@
<!-- html comment, output as it like -->
@layout("layout.html");
/ @renderBody();
for specify layout / fill layout
@renderSection('header');
/ @section
for define a section / fill a section
@include();
support
Engine
var razor = require('razor');
var Engine = razor.Engine; // razor engine class definition
// And razor is the default export engine
razor instanceof Engine; // true
locals
used in template@
used in templatetrue
,means @val
-> @locals.val
only if jQuery load before razor-tmpl as window.jQuery
for node's template
require/__dirname/__filename
is also available,so you can use razor
cli tool to render file without js code participate in.
path
option for node side, same as less import pathrazor-tmpl
via Package ControlComparsion : http://cnodejs.org/topic/4f16442ccae1f4aa27001109
Result : see benchmark.js