art-template基本语法

{{value}}
{{obj.key}}
{{obj['key']}}
{{a?b:c}}
{{a||b}}
{{a+b}}

原文输出:

{{@ value}}

条件输出:

{{if value}}按需输出的内容{{/if}}
{{if v1}}按需输出的内容{{else if v2}}按需输出的内容{{/if}}

//示例
 <div>
            {{if flag===0}}
            flag的值是0
            {{else if flag===1}}
            flag的值是1
            {{/if}}
</div>

循环输出:

 

{{each arr}}
{{$index}} {{$value}}
{{/each}}

//示例
<ul>
      {{each hobby}}
      <li>索引是:{{$index}},循环项是:{{$value}}</li>
      {{/each}}
</ul>

过滤器:

{{value | filterName}}

//定义过滤器的基本语法:
template.dafaults.imports.filterName=function(value){return 处理的结果}

//示例
 <div class="container"></div>
    <!-- 3.定义模板 -->
    <script type="text/html" id="tpl-user">
        <h3>{{regTime | dataFormat}}</h3>
    </script>
    <script>
        //定义处理时间的过滤器
        template.defaults.imports.dataFormat = function (date) {
            var y = date.getFullYyear()
            var m = data.getMonth() + 1
            var d = date.getDate()
            return y + '-' + m + '-' + d
        }
        // 2.定义需要渲染的数据
        var data = {
            regTime: new Date()
        }
        //4.调用template函数
        var htmlStr = template('tpl-user', data)
        //5.渲染HTML结构
        $('#container').html(htmlStr)
    </script>

 

posted @ 2022-03-03 11:04  星同学  阅读(112)  评论(0)    收藏  举报