文件名称:轻量级模板引擎SodaRender.zip
文件大小:20KB
文件格式:ZIP
更新时间:2022-08-06 14:07:18
开源项目
SodaRender 是轻量级的模板引擎。当前只支持 IE9,Chrome 和移动端的所有浏览器。SodaRender语法源自于AngularJS,前端框架Abstract.js已经内置SodaRender引擎,SodaRender引擎应用于腾讯手机QQ中,已被证实是一款优秀的模板引擎用法示例:Exampleshtml>head>title>SodaRender Examapletitle>head>div>ul id="targetUl">script type="text/soda" id="dataList">li soda-repeat="item in list" soda-if="item.show">{{item.name}}li>script>ul>div>html>var templateStr = document.getElementById("dataList")[removed];var target = document.getElementById("targetUl"); var data = { list: [ {name: "A"}, {name: "B"} ] }; var result = sodaRender(templateStr, data);target.appendChild(result);APIs Of SodaRendersodaRenderUSING : SodaRender(String templateStr, Object data)DESCR : Using templateStr with data to render templateRETURN: DOM Fragmentthe DOM Frament Object has a method innerHTML which will return the rendered HTML code.Meanwhile, you can use it like a common DOM Node, such as appending it to your target node.sodaFilterUSING : SodaFilter(String filterName, Function func(input, args...))DESCR : Defining Filters, so you can use filters in templateTemplate Language (AngularJs Template Like)More directives have been added{{}}out put expressions{{item.name 1}}soda-repeatsoda-repeat="item in array"soda-repeat="item in array track by index"soda-repeat="(key, value) in object"USING : SodaRender(String templateStr, Object data)DESCR : Using templateStr with data to render templatesoda-ifsoda-if="item.show"soda-classsoda-class="currItem === 'list1' ? 'active' : ''"soda-srcsoda-src="hello{{index}}.png"soda-bind-htmlsoda-bind-html="click"soda-stylesoda-style="style"soda-*soda-rx="{{rx}}%"filters{{input|filte1:args1:args2...|filter2:args...}} how to define filters? Just using sodaFilter Method as methioned above. Here is an example.sodaFilter('shortTitle', function(input, length){ return (input || '').substr(0, length); });Template belowdiv soda-repeat="item in list">div class="title">{{item.title|shortTitle:10}}div>div> 标签:SodaRender
【文件预览】:
SodaRender-master
----combined()
--------sodarender.js(5KB)
----Modfile(442B)
----test()
--------testNew.html(4KB)
--------user_script.html(808B)
--------use_mvvc.html(893B)
----src()
--------copyright.js(231B)
--------sodarender.js(17KB)
--------sodarender.old.js(5KB)
----README.md(3KB)
----README.old - 副本.md(4KB)
----release()
--------sodarender.js(5KB)
----example.old()
--------user_script.html(812B)
--------use_mvvc.html(600B)
--------sodarender()