标签：格式 style text lin var and logs handle roi
基本使用，并简单列举了几种常见的数据格式的渲染方式
js： var testTpl = Handlebars.compile($(‘#test‘).html()); //模板 var arr = [1,2,3] //数据 $(‘#box‘).append(testTpl(arr)); //调用
html： <script type="text/x-handlebars-template" id="test"> {{#each this}} <li>索引：{{@index}}，内容：{{this}}</li> {{/each}} </script>
下面说几种数据源如何渲染数据，js中基本一样，声明模板->声明要渲染数据->调用并插入到页面 ，不明白看 上面基本使用
数据源是Array
js: var arr = [1,2,3] html: {{#each this}} <li>索引：{{@index}}，内容：{{this}}</li> {{/each}}
数据源是数组对象（对象内部包含数组，再次each这个数组即可）
js： var arr = [ {‘a‘:‘1‘,‘b‘:2,‘c‘:[‘4‘,‘5‘,‘6‘]}, {‘a‘:‘11‘,‘b‘:22,‘c‘:[‘44‘,‘55‘,‘66‘]} ]; html： {{#each this}} <li>{{a}}</li> <li>{{b}}</li> {{#each c}} <li>父级索引{{../a}}.{{@index}}：访问父级：{{../a}} 。当前索引：{{@index}}，当前元素：{{this}} </li> {{/each}} {{/each}}
数据源是对象
js： var context = { data:{ one: "un", two: "deux", three: "trois" } } html： <ul> {{#each data}} <li>对象的key：{{@key}}，对象的值：{{this}}</li> {{/each}} </ul> <ol> {{#each data}} <li>对象的索引：{{@index}}，对象的值：{{this}}</li> {{/each}} </ol>
数据源数对象数组
js： var context = { data: ["one", "two", "three"], data2: ["one", "two", "three"], }; html： <ul> {{#each data}} <li> 数组的索引：{{@index}} ，索引对应的内容：{{this}}{{#eq @index 0}}王生辉{{/eq}} </li> {{/each}} {{#each data2}} <li> 数组的索引：{{@key}}，索引对应的内容：{{shenghui this}} </li> {{/each}} </ul>
说明：@key 和@index
@key：如果当循环的数据是数组 则返回下标，如果是对象则返回key值
@index：都返回下标
标签：格式 style text lin var and logs handle roi
原文地址：http://www.cnblogs.com/NTWang/p/7368014.html
