xtemplate
Version:
eXtensible Template Engine lib on browser and nodejs. support async control, inheritance, include, logic expression, custom function and more.
84 lines (70 loc) • 2.64 kB
HTML
<html>
<head>
<meta charset="utf-8"/>
<meta name="viewport"
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-touch-fullscreen" content="yes">
<link rel="stylesheet" href="//g.tbcdn.cn/kissy/k/1.4.2/css/dpl/base.css"/>
<link rel="stylesheet" href="//g.tbcdn.cn/kissy/k/1.4.2/css/dpl/forms.css"/>
<link rel="stylesheet" href="//g.tbcdn.cn/kissy/k/1.4.2/button/assets/dpl.css"/>
<script src="//g.alicdn.com/kissy/third-party/0.1.0/syntaxhighlighter/scripts/shCore.js"></script>
<script src="//g.alicdn.com/kissy/third-party/0.1.0/syntaxhighlighter/scripts/shBrushJScript.js"></script>
<link type="text/css" rel="stylesheet"
href="//g.alicdn.com/kissy/third-party/0.1.0/syntaxhighlighter/styles/shCoreDefault.css"/>
<script src="//g.alicdn.com/kissy/third-party/0.1.0/beautify.js"></script>
<script src="//g.tbcdn.cn/kissy/edge/2014.07.16/seed-debug.js"></script>
<script src="/bower_components/modulex/build/modulex-debug.js"></script>
<script>
modulex.config({
packages: {
xtemplate: {
filter: '',
base: '/lib/xtemplate'
}
}
});
function js_beauty(str) {
var opts = {"indent_size": "4", "indent_char": ' ',
"preserve_newlines": true, "brace_style": "collapse",
"keep_array_indentation": false, "space_after_anon_function": true};
return js_beautify(str, opts);
}
</script>
<title> simple xtemplate </title>
</head>
<body>
<div class="container">
<div class="row">
<div class="span8">
<h2>模板代码</h2>
<div>
<textarea style="width: 350px;height: 400px;" id="tpl">
{{3*4*5}}
</textarea>
</div>
<br/>
<button id='parse' class="ks-button">parse</button>
</div>
<div class="span15">
<h2>Generated Template Function</h2>
<div>
<div id="gen">
</div>
</div>
</div>
</div>
</div>
<script>
KISSY.use("node,util", function (S, $, util) {
modulex.use('xtemplate', function (XTemplate) {
$('#parse').on('click', function () {
var g = XTemplate.Compiler.parse($('#tpl').val());
S.log(g);
});
});
});
</script>
</body>
</html>