使用art-template循环进行html代码拼接

ApiPost-宣博文 前端 2020-09-22

我这边需要做的是把上次生成的html代码插入到下一次模板渲染中,那么要实现这个需求,我用的是

模板的拓展方法(过滤器)

template.defaults.imports.+(方法名/变量名) =变量值/方法 

那么具体如何实现呢 接下来 Code up:

//上一次产生的html代码
template.defaults.imports.lastHtml = "";

arrayList=[{name:"爸爸"},{name:"儿子"},{name:"孙子"}];

 arrayList.forEach(item => {
        //创建模板
        html = template("tpl", item);
        template.defaults.imports.nextHtml = html;
    });

console.log(html );

<!--输出结果
     <div>
          爸爸  
          <div>
            儿子
            <div>孙子</div>
          </div>
     </div>
-->
//HTML里的模板代码
<script type='text/html' id="tpl">
            {{if data > 1}}
            <div>
                {{data}}
                {{@$imports.lastHtml}}
            </div>
            {{else}}
            <div>{{data}}</div>
            {{/if}}
        </script>
Apipost 私有化火热进行中

评论