关于dot的使用参加链接:
http://www.malaoshi.top/show_1C71L3WLAPI2.html
引入js
先引 jquery,后引 doT
<script type="text/javascript" src="../script/APICloud-rest-SHA1.js"></script>
<script type="text/javascript" src="../script/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="../script/doT.js"></script>
定义dot模版
<!-- 模板 -->
<script id="articleTemp" type="text/x-dot-template">
{{~it:value:index}}
<div onclick='showById("{{= value.id }}")'>
{{= index+1 }}.{{= value.title }} {{= value.creatorName }}==={{= value.viewNum }}
</div>
{{~}}
</script>
定义显示数据的div
<div id="data_box">
</div>
js代码
apiready = function(){
showArticleList();
};
function showArticleList(){
var client = new Resource(APP_INFO.app_id, APP_INFO.app_key);
var Model = client.Factory("article");
Model.query({
filter:{
fields:{"id": true, "title": true, "viewNum": true,"creatorName": true}//或者["id","make","model"]
}
}, function(ret,err){
if(err){
//处理错误 err
}else{
//处理数据 ret
alert(JSON.stringify(ret));
//编译模版
var interation = doT.template( $('#articleTemp').html() );
//将数据显示到网页中
$( '#data_box' ).html(interation( ret ));
}
})
}
function showById(id){
alert(id);
api.openWin({
name: 'article_detail',
url: 'article_detail.html',
pageParam:{
"id":id
}
});
}