1.遍历
<div id="newInfo">
<script type="text/html" id="informationDetails">
<div class="info">
<p>{{list.title}}</p>
</div>
</script>
</div>
这是一个简单遍历
2.循环
<div id="home">
<script type="text/html" id="news">
{{each list as value index}}
<div class="home_list" >
<div class="home_list_content">
<p class="content_title">{{value.title}}</p>
<div class="content_description">{{value.body}}</div>
</div>
</div>
{{/each}}
</script>
</div>
这是一个简单循环
3.循环嵌套
<tbody id="tbody">
<script type="text/html" id="baggage">
{{each list as value index}}
<tr class="colspan">
<th colspan="4">{{value.rule_category_name}}</th>
</tr>
{{include 'matter' value.rule}}
{{/each}}
</script>
<script type="text/html" id="matter">
{{each data as value index}}
<tr>
<td class="table_th">{{index+1}}</td>
<td class="table_t2">{{value.rule}}</td>
</tr>
{{/each}}
</script>
</tbody>
</table>
根据后台返回数据的一个简单循环嵌套,数据样式:
{
"data": [
{
"id": 24,
"travel_id": "2",
"type": "30",
"rule_category_name": "其他物品",
"rule": {
"data": [
{
"id": 25,
"rule_category_id": 24,
"rule": "Saepe nulla animi delectus consectetur non.",
"is_created": 1,
"examines": {
"id": 108,
"user_id": 1,
"rule_id": 25,
"before": true,
"after": true,
"created_at": null,
"updated_at": "2019-01-04 16:28:49"
}
}
]
}
}
]}
4.判断
{{if testValue==22}}
<h1>线上</h1>
{{else if testValue==33}}
<h2>隐藏</h2>
{{else}}
<h3>走这里</h3>
{{/if}}