art.template 循环里面分组。
后台提供给我们一个数组,我们要用模版实现上面的格式输出怎么版呢?
下面就是解决方案:
<h2>循环4个一组</h2>
<script type="text/html" id="temp1">
<b>
{{each rows as item i}}
{{if i%4==0}}<b>【{{/if}}
{{item.userName}}
{{if i>0 && (i-3)%4==0}}】</b>{{/if}}
{{/each}} </ul>
</script> <script>
var data={
"rows":[
{"userName":"项目1"},
{"userName":"项目2"},
{"userName":"项目3"},
{"userName":"项目4"},
{"userName":"项目5"},
{"userName":"项目6"},
{"userName":"项目7"},
{"userName":"项目8"},
{"userName":"项目9"},
{"userName":"项目10"},
{"userName":"项目11"},
{"userName":"项目12"},
{"userName":"项目13"},
{"userName":"项目14"},
{"userName":"项目15"},
{"userName":"项目16"},
{"userName":"项目17"},
{"userName":"项目18"},
{"userName":"项目19"},
{"userName":"项目20"}
]
}
var html=template("temp1",data) document.write(html) </script>
如果这篇文章对您有帮助,您可以打赏我
技术交流QQ群:15129679
art.template 循环里面分组。的更多相关文章
- art template前端模板引擎
偶然看到后台有一段代码 采用的是art template的模板引擎 地址为 http://aui.github.io/artTemplate/ 这段代码很简洁 var html = template( ...
- 利用art.template模仿VUE 一次渲染多个模版
TypeScript代码 import template = require('art-template/lib/template-web'); interface TemplateBindConfi ...
- 利用art.template模仿VUE
首先先看一下Typescript代码: import template = require('art-template/lib/template-web'); interface TemplateBi ...
- js 模板引擎 -Art Template
一个例子涵盖所有: <!doctype html> <html> <head> <meta charset="UTF-8"> < ...
- Ajax接收Json数据,调用template模板循环渲染页面的方法
一. 后台接口吐出JSON数据 后台php接口中,需要写三个部分: 1.1 开头header规定数据格式: header("content-type:application/json;cha ...
- hdu 1712 ACboy needs your help 分组背包
转载请注明出处:http://blog.csdn.net/u012860063 题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1712 Problem ...
- Pandas 基础(7) - Group By 分组的相关知识
首先, 引入这节需要的 csv 文件 (已上传) import pandas as pd city_df = pd.read_csv('/Users/rachel/Sites/pandas/py/pa ...
- HDU1712:ACboy needs your help(分组背包模板)
http://acm.hdu.edu.cn/showproblem.php?pid=1712 Problem Description ACboy has N courses this term, an ...
- HDU1712:ACboy needs your help(分组背包)
题目:http://acm.hdu.edu.cn/showproblem.php?pid=1712 解释看这里:http://www.cnblogs.com/zhangmingcheng/p/3940 ...
随机推荐
- brew装snappy
brew装snappy,我在mac上已经开了socks5代理,也尝试了lantern或者duotai.org,结果都下载不动. 解决方法:把snappy包手动从浏览器下载,然后放到缓存目录,再执行br ...
- DDD领域模型数据访问权限之权限(十二)
实现权限的领域对象:BAS_Permission public partial class BAS_Permission:AggreateRoot { private IRepository<B ...
- istringstream、ostringstream、stringstream 类介绍 和 stringstream类 clear函数的真正用途
istringstream.ostringstream.stringstream 类介绍 和 stringstream类 clear函数的真正用途 来源: http://blog.csdn.net/T ...
- SimInfo获取(MCC, MNC, PLMN)
String NUMERIC = getSIMInfo(); protected String getSIMInfo() { TelephonyManager iPhoneManager = (Tel ...
- C#中decimal ,double,float的区别
浮点型 Name CTS Type Description Significant Figures Range (approximate) float System.Single 32-bit sin ...
- Map集合遍历的四种方式理解和简单使用
~Map集合是键值对形式存储值的,所以遍历Map集合无非就是获取键和值,根据实际需求,进行获取键和值 1:无非就是通过map.keySet()获取到值,然后根据键获取到值 for(String s:m ...
- java:给你一个数组和两个索引,交换下标为这两个索引的数字
给你一个数组和两个索引,交换下标为这两个索引的数字 import java.util.Arrays; public class Solution { public static void main(S ...
- jquery中方法扩展 ($.fn & $.extend) 学习笔记
A.$.fn 1.$.fn.method() 函数为jQuery对象扩展一个属性和方法(主要用于扩展方法) :method 为自定义方法名 ($.fn 等效 $.prototype) $.fn.bor ...
- HDU3038 How Many Answers Are Wrong 并查集
欢迎访问~原文出处——博客园-zhouzhendong 去博客园看该题解 题目传送门 - HDU3038 题意概括 有一个序列,共n个数,可正可负. 现在有m个结论.n<=200000,m< ...
- jquery $与jQuery
jquery的兼容 ie8 <script type="text/javascript" src="<%=path%>/js/jquery-3.1.1. ...