首页 > 代码库 > JsRender系列demo(5)compline
JsRender系列demo(5)compline
<!DOCTYPE html><html><head> <script src="http://code.jquery.com/jquery.js" type="text/javascript"></script> <script src="http://www.mamicode.com/jsrender.js" type="text/javascript"></script> <link href="http://www.mamicode.com/resources/demos.css" rel="stylesheet" type="text/css" /></head><body><a href="http://www.mamicode.com/demos.html">JsRender Demos</a><br /><h3>Accessing paths</h3><script id="peopleTemplate" type="text/x-jsrender"> <b>{{:#index+1}}:</b> {{>firstName}} {{>lastName}}: <br/> {{for address tmpl="#addressTemplate"}}{{else}} Address missing {{/for}} <div> Phones: {{for ~combine(phones, cells)}} <b>{{>#data}}</b> ({{>#parent.parent.data.firstName}}‘s) {{else}} {{>#parent.data.firstName}} has no phones or cells {{/for}}{{!-- or provide an alias to get to firstName from nested content Phones: {{for ~combine(phones, cells) ~frstNm=firstName}} <b>{{>#data}}</b> ({{>~frstNm}}‘s) {{else}} {{>~frstNm}} has no phones or cells {{/for}}--}} </div> <br/> <i> {{>firstName}} {{if address && address.street}} {{!-- address may be null or undefined --}} lives in {{>address.street}}. {{else}} has no address... {{/if}} </i> <hr/></script><script id="addressTemplate" type="text/x-jsrender"><div> {{if street}} {{>street}} {{else}} <i>Somewhere</i> in {{/if}} {{>city}}</div></script><div id="peopleList"></div><script type="text/javascript"> var people = [ { firstName: "Pete", lastName: "Ruffles", address: { city: "Bellevue" }, cells: ["425 666 3455", "425 222 1111"] }, { firstName: "Xavier", lastName: "NoStreet", phones: ["222 666 3455"], cells: ["444 666 3455", "999 222 1111"] }, { firstName: "Christie", lastName: "Sutherland", address: { street: "222 2nd Ave NE", city: "Redmond" } } ]; $.views.tags({ notLast: function( content ) { var array = this.parent.data; return array[ array.length - 1 ] === this.data ? "" : content( this ); } }); $.views.helpers({ combine: function( arr1, arr2 ) { return arr1 && arr2 ? arr1.concat(arr2) : arr1 || arr2; } }); $( "#peopleList" ).html( $( "#peopleTemplate" ).render( people ) );</script></body></html>
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。