arttemplate的几种常用写法

最新推荐文章于 2021-06-22 17:16:17 发布

weixin_30677617

最新推荐文章于 2021-06-22 17:16:17 发布

阅读量202

点赞数

文章标签： java

原文链接：http://www.cnblogs.com/shuaitong/p/7453139.html

版权

list:[ {


        "name" : "",
            "age" : 24,
            "scoreList" : [ {
                "sname" : "java",
                "score" : 100
            }, {
                "sname" : "c++",
                "score" : 100
            } ]
        } ]


//模板代码
<script id="testTemplate" type="text/html">
    {{each list}}
        <span>{{$value.name}}</span>
        <span>{{$value.age}}</span>
        {{include 'scoreTemplate' $value}} //引入子模板
    {{/each}}
</script>

//子模板

<script id="scoreTemplate" type="text/html"> {{each scoreList}} <span>{{$value.name}}</span> <span>{{$value.score}}</span> {{/each}} </script> // each value i <script id="hdlist" type="text/html"> {{each activityNameList value i}} <div class="hd"> <h1>{{value.activityName}}</h1> <div class="list"> <div class="title"> 已发送的 </div> {{each activityFollowUpRecord}} {{if activityNameList[i].tivityId==$value.activityId}} <div class="lists"> <p> {{$value.record}} <span>{{$value.recordTime}}</span> </p> </div> {{/if}} {{/each}} </div> </div> {{/each}} </script> <ul class="comultwo"> {{each childrens value i}} <li class="litwo" src='{{value.url}}'>{{value.name}}</li>  {{each value.childrens}} <input type="text" value="{{$value.name}}" > {{/each}} {{/each}} </ul>  模板语法 var source ='{{each data value i}}' + '<li>' + '<a id="{{value.id}}" href="{{value.url}}" class="menu-dropdown">' + '<i class="menu-icon fa fa-table"></i>' + '<span class="menu-text">{{value.name}}</span>' + '<i class="menu-expand"></i>' + '</a>' + '{{each value.childrens}}' + ' <ul class="submenu">' + ' <li>' + ' <a id="{{$value.id}}" href="{{$value.url}}">' + '<span class="menu-text">{{$value.name}}</span>' + ' </a>' + '</li>' + ' </ul>' + '{{/each}}' + '</li>' + '{{/each}}'; var render = template.compile(source); var html = render({ list: ['摄影', '电影', '民谣', '旅行', '吉他'] });

过滤器
 <td>{{$value.birthday | momenta}}</td>

  function momenta(date) {
            return moment(date).format('YYYY-MM-DD');
        }

问档地址：https://aui.github.io/art-template/docs/syntax.html#过滤器

转载于:https://www.cnblogs.com/shuaitong/p/7453139.html