后台提供给我们一个数组,我们要用模版实现上面的格式输出怎么版呢?

下面就是解决方案:

<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 循环里面分组。的更多相关文章

  1. art template前端模板引擎

    偶然看到后台有一段代码 采用的是art template的模板引擎 地址为 http://aui.github.io/artTemplate/ 这段代码很简洁 var html = template( ...

  2. 利用art.template模仿VUE 一次渲染多个模版

    TypeScript代码 import template = require('art-template/lib/template-web'); interface TemplateBindConfi ...

  3. 利用art.template模仿VUE

    首先先看一下Typescript代码: import template = require('art-template/lib/template-web'); interface TemplateBi ...

  4. js 模板引擎 -Art Template

    一个例子涵盖所有: <!doctype html> <html> <head> <meta charset="UTF-8"> < ...

  5. Ajax接收Json数据,调用template模板循环渲染页面的方法

    一. 后台接口吐出JSON数据 后台php接口中,需要写三个部分: 1.1 开头header规定数据格式: header("content-type:application/json;cha ...

  6. hdu 1712 ACboy needs your help 分组背包

    转载请注明出处:http://blog.csdn.net/u012860063 题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1712 Problem ...

  7. Pandas 基础(7) - Group By 分组的相关知识

    首先, 引入这节需要的 csv 文件 (已上传) import pandas as pd city_df = pd.read_csv('/Users/rachel/Sites/pandas/py/pa ...

  8. HDU1712:ACboy needs your help(分组背包模板)

    http://acm.hdu.edu.cn/showproblem.php?pid=1712 Problem Description ACboy has N courses this term, an ...

  9. HDU1712:ACboy needs your help(分组背包)

    题目:http://acm.hdu.edu.cn/showproblem.php?pid=1712 解释看这里:http://www.cnblogs.com/zhangmingcheng/p/3940 ...

随机推荐

  1. 步步为营-57-JQuery练习题

    01 点谁谁哭 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head&g ...

  2. 【C++】类前置声明范例

    • 在编写C++程序的时候,偶尔需要用到前置声明(Forward declaration).下面的程序中,带注释的那行就是类B的前置说明.这是必须的,因为类A中用到了类B,而类B的声明出现在类A的后面 ...

  3. HDU 1517 (累乘 找规律)

    题意:2 个人玩游戏,从 1 开始,轮流对数进行累乘,直到超过一个指定的值. 解题思路:如果输入是 2 ~ 9 ,因为Stan 是先手,所以Stan 必胜如果输入是 10~18 ,因为Ollie 是后 ...

  4. WP8 调用webservice 错误 The remote server returned an error: NotFound 解决

    本人出错是由于本地的IIS不能被局域网其它机器访问导致的,如果你所用的本机IIS 也不可被其它机器访问,则可按照本文进行设置   具体操作时需要在防火墙设置中添加 入站规则   具体步骤如下: 1.控 ...

  5. Docker 注意事项

    一.Dockerfile名字不能是大写. 二.Docker-compares 引用自:https://www.cnblogs.com/wj5633/p/6707012.html 引用自:https:/ ...

  6. echarts 折线统计笔记

    效果案例图 需要引入的js文件可以直接去官网下载 下面是代码 <!--第一步: 引入 ECharts 文件 --> <script src="static/js/myjs/ ...

  7. 020 $.each的使用

    在工作中见到这个知识点,不是特别懂,就查了查资料,顺便整理一下 1.定义与用法 each() 方法规定为每个匹配元素规定运行的函数. 提示:返回 false 可用于及早停止循环. 语法 $(selec ...

  8. VSCode从非根目录编译golang程序(转)

    1.问题提出 “习惯在项目目录里建src放源码文件,根目录里放配置文件或者别的什么,在交付时直接忽视掉src目录就行了,但vscode好像不能这样愉快的玩耍...”??? 要实现把源码放到src目录下 ...

  9. Pytorch 基础

    Pytorch 1.0.0 学习笔记: Pytorch 的学习可以参考:Welcome to PyTorch Tutorials Pytorch 是什么? 快速上手 Pytorch! Tensors( ...

  10. Alpha冲刺随笔二:第二天

    课程名称:软件工程1916|W(福州大学) 作业要求:项目Alpha冲刺(十天冲刺) 团队名称:葫芦娃队 作业目标:在十天冲刺里对每天的任务进行总结. 随笔汇总:https://www.cnblogs ...