art-template提取某个重复字段，使其仅显示一次

记录自己遇到的难点总结，大佬请绕道~

如题，查询度娘发现art-template相关资料甚少，还都是一些很基础的问题，然鹅出了另一个很基础的问题，这在原生分分钟可以，还是对art-template模板了解的少，所以费了点时间，想了好久解决不了，感谢后台同事（作为一个前端手动捂脸），也只能说自己太菜（再次手动捂脸），好了，上代码~

先说下需求与数据，因为是数据迁移，后台处理数据有些麻烦，前端处理更方便一些，数据格式如下，需求是相同column，仅显示一次，其他数据正常循环。

{
   "list": [
              {
                "column": "美食",
                "title": "宫保鸡丁",
                "year": "2020",
                "content": "材料准备，将鸡胸肉用刀背稍稍拍松，然后切块备用；花生仁去皮；葱切段；干辣椒去籽剪成小段；豆瓣酱剁碎；姜切小片；蒜切末备用。用蛋清、1勺淀粉、料酒将鸡胸肉抓匀，腌制十几分钟。凉锅中放入少许油，然后将花生仁放到锅内。小火炸制花生仁成金黄色捞出晾凉备用。用糖、盐、香醋、酱油、鸡精、玉米淀粉调成汁备用。将锅烧热，然后倒入适量食用油。接下来再把鸡肉放入锅中，迅速打散。鸡肉变白即可盛出备用。锅中留少许底油，先放入花椒和干辣椒小火煸炒出香味，再将豆瓣酱和辣椒面倒入锅中煸炒出红油，接下来将姜片和蒜末放入锅中，煸炒出香味。改成大火，将鸡丁倒入锅中，翻炒匀均。将葱段放入锅中，翻炒匀均。将调好的汁倒入锅中烧开。将花生仁倒入锅中。翻炒匀均后，淋少许香油，即可出锅。",
              },
              {
                "column": "美食",
                "title": "红烧带鱼",
                "year": "2020",
                "content": "1、煎。带鱼洗净晾干，为了保险可以用纸巾把水吸净。还有一种选择是裹上面粉，这样就不会因为有水而很容易崩油了。锅里下油，烧热，下鱼煎，中间翻一次面，煎到两面金黄放到一边备用。2、烧。换新油，放葱姜蒜，爆香，放带鱼翻炒。放料酒酱油醋，焖一下，放适量的糖和盐，翻炒几下，加水，与带鱼平齐。开大火浓缩汤汁，盛盘即可。",
              },
              {
                "column": "美食",
                "title": "酸辣土豆丝",
                "year": "2020",
                "content": "1、土豆去皮，切丝。2、土豆丝放入凉水中洗去多余淀粉。3、干辣椒切小段，大蒜拍碎。4、锅里加水，烧开，放进土豆丝烫半分钟，捞出冲冷水，沥干水分。5、锅里下油，下花椒小火炸香，捞出花椒。6、倒进干辣椒和大蒜爆锅大火炒香。7、倒进土豆丝，快速快速翻炒。8、沿锅边倒入白醋，醋遇热大部分酸味挥发，留下醋香。加食盐和白糖调味。9、全程大火快速翻炒，保证土豆脆爽。出锅前加入小葱段即可。",
              },
              {
                "column": "电视剧",
                "title": "《觉醒年代》",
                "year": "2020",
                "content": "重大革命历史题材电视剧《觉醒年代》由中共北京市委宣传部、中共安徽省委宣传部、北京市广播电视局和安徽省广播电视局联合摄制，由北京北广传媒影视股份有限公司和安徽华星传媒投资有限公司承制，由北京北广传媒影视股份有限公司、安徽华星传媒投资有限公司、优酷信息技术（北京）有限公司和上海克顿文化传媒有限公司联合出品。编剧：龙平平，导演：张永新，总制片人：刘国华，主演：于和伟、张桐、侯京健、马少骅、朱刚日尧、张晚意、曹磊、夏德俊等。",
              },
              {
                "column": "电视剧",
                "title": "《机智的医生生活》",
                "year": "2020",
                "content": "《机智医生生活第二季》是一部“季播制”韩剧。《机智医生生活》第一季在5月底播毕，随即宣布第二季会在11月开拍。由《请回答系列》、《机智牢房生活》的导演申元浩再次携手《请回答系列》编剧李祐汀，合作打造。",
              },
              {
                "column": "生活",
                "title": "居家生活小妙招",
                "year": "2020",
                "content": "1.吃不完的柠檬保鲜 将柠檬切成片放入保鲜盒，再淋上蜂蜜，盖上保险盒，放入冰箱即可。早上起来可以取两片蜂蜜柠檬，用温水冲一下，就成了一杯柠檬蜂蜜水。这就是用腌制的方法保存柠檬。2.香蕉皮保养皮鞋 (1)香蕉皮内侧把皮鞋擦干净。香蕉皮内富含丹宁，用来擦鞋，可使鞋面更加光洁。(2)然后马上用干净的干布再把鞋擦一遍，皮鞋就会变得超级有光泽。3.酸奶给手背去死皮  将酸奶涂在手背上，用手揉搓就能轻松去死皮，如果往酸奶里再加些盐和橄榄油，效果会更好。4.延长鲜花花期 在水中滴2-3滴白醋或漂白水，并将花枝斜着剪一刀，插入水中即可。5.去除浴室镜子的雾气 把浴室的镜子或玻璃上擦上洗涤灵水，可以防止镜子起雾、蒙上水蒸气。6.去除马桶污渍 将卫生纸铺在马桶有污渍的地方，喷上清洁剂，2分钟手用水冲掉，马桶就干净了。",
              },
              {
                "column": "旅游",
                "title": "北京故宫",
                "year": "2020",
                "content": "北京故宫是中国明清两代的皇家宫殿，旧称紫禁城，位于北京中轴线的中心。北京故宫以三大殿为中心，占地面积约72万平方米，建筑面积约15万平方米，有大小宫殿七十多座，房屋九千余间。",
              },
              {
                "column": "旅游",
                "title": "上海东方明珠",
                "year": "2020",
                "content": "东方明珠广播电视塔，简称“东方明珠”，位于上海市浦东新区陆家嘴世纪大道1号，地处黄浦江畔，背拥陆家嘴地区现代化建筑楼群，与隔江的外滩万国建筑博览群交相辉映，始建于1994年10月1日，是集都市观光、时尚餐饮、购物娱乐、历史陈列、浦江游览、会展演出、广播电视发射等多功能于一体的上海市标志性建筑之一，为亚洲第一高塔、世界第三高塔。",
              }
    ]
}

模板数据里面，还做了隔行变色的判断，但困惑自己的点是：如何做到当前数据与上次数据的比对，没想到还能这样写：list[$index-1].column，还是我对art-template不了解呀，上代码~

<script type="text/html" id="testBox">
        <ul>
            {{ each list }}
                {{if $index == 0 }}
                    <h1><b>归类：</b>{{ $value.column }}</h1>
                {{ else }}
                    {{ if(list[$index-1].column != $value.column) }}  
                        <h1><b>归类：</b>{{ $value.column }}</h1>
                    {{ /if }}
                {{ /if }}
                    {{ if $index % 2 == 0 }}
                        <li>
                    {{ else }}
                        <li class="gray">
                    {{ /if }}
                            <p><b>名称：</b>{{ $value.title }}</p>
                            <p><b>年份：</b>{{ $value.year }}</p>
                            <p class="con"><b>内容：</b>{{ $value.content }}</p>
                        </li>
            {{ /each }}
        </ul>
</script>

js就正常使用：

var html = template('testBox', {list: list})
var container = document.querySelector('#test');
container.innerHTML = html;

html:

<div id="test"></div>

效果如下：