您的位置：首页 > Web前端 > JavaScript

[JavaScript] Use template engine in Dojo

2014-03-27 18:51 302 查看

This is a trial to embed the underscore template utility into Dojo toolkit.

define("myjs/Header",["dojo/_base/declare","dijit/_WidgetBase","dojo/text!./templates/header.html"],

function(declare, _WidgetBase,tpl){

return declare('myjs.Header',[_WidgetBase], {
render: function(context){
this.postMixInProperties();
var compiledTmpl = _.template(tpl, { citys : ["BeiJing","ShangHai","ShenZhen"] });
this.srcNodeRef.innerHTML = compiledTmpl;
},
buildRendering: function(){
this.render();
},
postMixInProperties: function(){
this.inherited(arguments);
}
});

});

<ul>
<% for (var i = 0; i < citys.length; i++) { %>
<% var city= citys[i]; %>
<li>
<em><%= city %></em>
</li>
<% } %>
</ul>

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Dojo Application</title>
<link rel="stylesheet" href="myjs/resources/main.css">
<script src="http://underscorejs.org/underscore-min.js"></script>
</head>
<body class="claro">
<div id="page">

<div id="header">

<div id="nav"></div>

</div>

<div id="main"></div>

<div id="footer"></div>

</div>

<script src="dojoConfig.js"></script>
<script src="dojo/dojo.js"></script>

<script type="text/javascript">
if(require){
require(["myjs/Header","dojo/domReady!"],function(Header){
var options = {};
var header = new Header(options,"nav");
header.startup();
});
}
</script>

</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航