ic tpl指令 - Julienedies/brick GitHub Wiki
<div>
<table>
<thead>
<tr>
<th>公司名称</th>
<th>公司代码</th>
<th>最新股价</th>
<th>最新涨跌幅</th>
<th>七天涨跌幅</th>
<th>同业排名</th>
</tr>
</thead>
<tbody ic-tpl="list">
<tr ic-for="i, v in model" ic-for-init="company=v.company">
<td>
<a ic-href="/stock/profile/{{company.code}}" target="_blank" ic-bind="company.abbrSzh"></a>
</td>
<td>
<a ic-href="/stock/profile/{{company.code}}" target="_blank" ic-bind="company.code"></a>
</td>
<td ic-bind="v.closePrice">37.40</td>
<td ic-class="fc-{{v.changeRatio<0?'down':'up'}}">
<span ic-bind="v.changeRatio.toFixed(2)">+0.01</span>%
</td>
<td ic-class="hc fc-{{v.changeRatio7<0?'down':'up'}}">
<span ic-bind="v.changeRatio7.toFixed(2)">+0.01</span>%
</td>
<td ic-bind="++i">2,349,345M</td>
</tr>
</tbody>
</table>
</div>以上html代码定义了一个名为list的模板，该模板被存储在brick中，可以通过brick.getTpl('list')取得。
绑定ic-tpl指令的dom元素,尽量避免再绑定其它指令,其它指令可以绑定在父元素上或子元素上,否则指令可能会重复多次执行或遗漏执行.
{{}} 所有双大括号里面的代码都会被转为js表达式； 如果{{}}语法和其它服务器端模板语法冲突，可以修改为<%= %>；
- ic-skip 跳过，该dom元素不参与模板生成；
- ic-init 初始化，
- ic-for 循环，用于单个dom元素循环；
- ic-for-start 循环开始，用于多个dom元素循环；
- ic-for-init 循环初始化
- ic-if 对单个dom元素进行条件判断
- ic-else-if 或者另外一个条件
- ic-if-start 多个dom元素条件判断
- ic-if-init
- ic-else 或者
- ic-bind 为dom绑定text值
- ic-if-end 多个dom元素条件判断结束
- ic-for-end 多个dom元素循环结束
- ic-(checked|disabled) 根据表达式的值判断是否输出checked或disabled属性。
- ic-has-[prop] 根据表达式的值判断是否输出prop属性。
js中使用模板
$('[ic-tpl=a]').icRender({v:1}); //jquery 接口, 可选的模板名和回调函数
$('#demo2').icRender('a', {v:1}, function(){ console.info(this,arguments);});
var tpl = brick.getTpl('list'); //取得模板
var html = tpl({model:{...}}); //传入数据模型进行渲染
$('[ic-tpl=list]').html(html); //更新html无。
无。